您可以将 JavaScript 和 CSS 文件存储在 localStorage 中以提高在线 Web 应用程序的性能吗？
我正在开发一个 Web 应用程序，它的行为非常类似于 iOS 和 Android 的本机应用程序。然而，Javascript 文件（jQuery + 我自己的）和 css 文件对于移动使用来说相当大，如果用户没有启用 3G，这会使应用程序加载缓慢。
因此我开始考虑离线存储这些文件。然而，除了cache.manifest（据我所知，只有在没有互联网连接来启用离线使用时才会启动）之外，我没有找到任何方法。我理想地想要的是检查文件是否已经缓存/存储，如果没有，则使用它们，然后存储它们以供下次使用。
这可能吗？这将大大减少加载我的应用程序的时间，因为索引文件本身非常小。我仍在努力通过优化来精简文件，但这同时会有很大帮助。
编辑：
只是为了提供更多细节，如果我之前不清楚，抱歉。
我已经开始使用 HTML5 样板构建此 Web 应用程序，并且我的 .htaccess 文件包含所有 JS 和 CSS 文件头，有效期为 1 年。
但似乎从 iOS 主屏幕打开应用程序每次都会加载 .js 和 .css 文件，就像未缓存它们时的情况一样。在桌面甚至 iOS Safari Web 浏览器上打开网站似乎确实以正确的方式缓存文件，因为 Javascript 和 CSS 中的更改只有在手动刷新页面后才会显示。
看起来从主屏幕打开、关闭和打开网络应用程序相当于刷新，因此每次都会加载文件，即使它们是通过cache.manifest存储以供离线使用的，并且文件的到期日期是设定在遥远的未来。
编辑2：
我想包含文件的缓存头。这些看起来好像还可以。
缓存控制 max-age=31536000，公共
截止时间 2012 年 5 月 18 日星期五 17:34:20 GMT
改变接受编码，用户代理
内容编码 gzip 保持活动超时=2，最大值=98
I'm working on a web application, which acts pretty much like a native application for both iOS and Android. However the Javascript files (jQuery + my own) and the css file together are pretty large for mobile use, which make the app slow to load if the user doesn't have 3G enabled.
I therefore started to think about storing these files offline. However aside from the cache.manifest (which in my knowledge only kicks in when there is no internet connection to enable offline use) I have found no way to this. What I ideally would like to have is to check if the files are already cached/stored and if not, use them and then store them for the next time.
Is this possible? This would reduce the time to load my app a lot as the index file itself is very small. I'm still working on slimming down the files by optimizing but this would help a lot in the meantime.
EDIT:
Just to provide a bit more detail, sorry if I was unclear before.
I've started building this webapp using the HTML5 boilerplate, and my .htaccess file has all JS and CSS file headers with an expiration date of 1 year.
But it seems that opening the app from the iOS Home Screen loads the .js and .css files each time, as was the case for when they are not cached. Opening the website on a desktop or even the iOS Safari web browser does seem to cache the files the right way, as changes in the Javascript and CSS are only displayed after manually refreshing the page.
It seems like opening and closing and opening the web-app from the home screen is acting as a refresh, therefore loading the files each time, even though they are stored through a cache.manifest for offline use, and the files' expiration dates are set far into the future.
EDIT 2:
Thought I'd include cache headers for the files. These seem to be alright.
Cache-Control max-age=31536000, public
Expires Fri, 18 May 2012 17:34:20 GMT
Vary Accept-Encoding,User-Agent
Content-Encoding gzip Keep-Alive timeout=2, max=98
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（4）
那么您应该研究这个选项：
https://developer.apple.com/库/archive/documentation/iPhone/Conceptual/SafariJSDatabaseGuide/OfflineApplicationCache/OfflineApplicationCache.html
You should investigate this option then:
https://developer.apple.com/library/archive/documentation/iPhone/Conceptual/SafariJSDatabaseGuide/OfflineApplicationCache/OfflineApplicationCache.html
应该可以让浏览器缓存像 javascript include 这样的资源（尽管最终这些指令可以被用户覆盖，可能不需要担心）。有关缓存的速成课程，请参阅此处。特别是查看 HTTP 标头：
它应该强制浏览器缓存资源。不确定这是否适用于跨会话，例如，如果浏览器关闭并重新打开，但当用户第一次访问您的网站时至少只会发出一个请求，并且不会在后续页面视图中重新请求。
另外，请确保您的 javascript 包含最小化，并参阅此处了解有关加快速度的一般提示。
It should be possible to get a browser to cache assets like javascript includes (although ultimitely these directives can be over-ridden by the user, probably not something to worry about). See here for a crash-course on caching. In particular see the HTTP header:
which should force the browser to cache the asset. Not sure if this works across sessions, e.g if the browser is closed and re-opened, but at least only one request will be made when the user first hits your site, and won't be re-requested on subsequent page views.
Also make sure your javascript includes are minimised, and see here for general tips on speeding things up.
iOS 不会缓存超过 25k 的资源。本地存储应该可以工作。
iOS will not cache resources beyond 25k. localStorage should work.
我也一直在尝试完成这项工作，但没有运气。似乎执行此操作的唯一方法如下：
看看http://sunpig.com/martin /archives/2011/05/21/considerations-for-caching-resources-in-localstorage.html 有关实施的想法！
我才完成一半，但它已经比依赖 appCache 工作得更好了。
编辑：请记住，这仅对多页面应用程序有用。如果您正在构建单页 JS 应用程序，我认为不值得花精力存储回 localStorage。您不妨内联所有内容并将其保留在那里以获得最佳性能。
I've also been attempting to get this done without any luck. It seems the only way to do this is the follows:
Have a look at http://sunpig.com/martin/archives/2011/05/21/considerations-for-caching-resources-in-localstorage.html for ideas on implementation!
I'm only halfway through but it's already working much better than depending on the appCache.
Edit: Keep in mind this is only useful for multi-page apps. If you're building a single page JS app, I don't think it's worth the effort to store back in localStorage. You might as well just inline everything and keep it there for best performance.