资产的HTML5 localStorage（样式表，JavaScript，图像等）

Question

为了节省客户端下载时间和网络使用率，是否可以使用HTML5的localStorage功能来存储链接样式表，javascript文件和二进制数据（例如图像）的内容，而不是每次都点击服务器？

这会让事情变得复杂 - 因为我假设您必须通过JavaScript而不仅仅是script或link元素添加链接的资源，为没有启用JavaScript的人打破页面？除非您可以在浏览器下载之前解析内容（使用HEAD请求检查上次修改日期和其他标题）。

或者最好只留下304 Not Modified和eTag标题？

Answer 1

我认为在这种情况下你应该考虑离线缓存：

• https://developer.mozilla.org/en/Offline_resources_in_Firefox#Specifying_a_cache_manifest

您还可以将用户输入数据存储在localStorage或sessionStorage中：

• https://developer.mozilla.org/en/DOM/Storage#sessionStorage
• https://developer.mozilla.org/en/DOM/Storage#localStorage

不要使用globalStorage（不是标准）。

我写了一篇关于离线的文章，请参阅：http://hacks.mozilla.org/2010/01/offline-web-applications/

这是关于离线的，但这种机制可用于提升您的网络应用程序。

Answer 2

您可以对您的图像/二进制数据进行base64编码并将其存储为localStorage中的字符串，使用base64网址在少数浏览器中不起作用，因此它不是一个完美的解决方案。

CSS和js没问题，您可以将它们写入页面，也可以使用base64 URL。

我不担心这会破坏非JS用户的网站，因为JS被禁用你无论如何都无法访问localStorage。