html - 用于资产（样式表、JavaScript、图像等）的 HTML5 localStorage

Question

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

这只会使事情复杂化 - 因为我假设您必须通过 JavaScript 添加链接的资产，而不仅仅是一个scriptorlink元素，从而破坏那些没有启用 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 url​​ 在某些浏览器中不起作用，因此它不是一个完美的解决方案。

CSS 和 js 就可以了，你可以将它们写入页面，或者也使用 base64 url​​。

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