HTML5 appcache 比使用过期标头或本地存储更好吗？答案

【问题标题】：Is HTML5 appcache better than using expires headers or localstorage?HTML5 appcache 比使用过期标头或本地存储更好吗？
【发布时间】：2012-10-16 20:04:29
【问题描述】：

考虑以下场景：

网站/应用只能在线使用 - 需要有效的互联网连接；
所有文件都有适当的过期标头设置；
可以通过 myFile.css?v=2 和 location.reload(true); 之类的方式处理强制文件刷新；

如果我使用 HTML5 的 appcache（清单），我的网站/应用实际上会加载得更快吗？为什么？我环顾四周，但似乎对这个问题没有一致的答案。

HTML5Rocks 建议使用 appcache 但我认为这主要是由于缓存重新加载管理。

后续问题：在localstorage中缓存文件怎么样？与其他两个相比，它处于什么位置？

【问题讨论】：

标签： html local-storage html5-appcache expires-header

【解决方案1】：

您缓存的文件有多大，您的目标浏览器和设备是什么？对于普通的桌面浏览器，它可能不会有太大的不同。在移动浏览器上，它已被使用/推荐作为25kb limit on resources cached by the iPhone 的解决方法，另请参阅这两篇后续文章：Mobile Browser Cache Limits: Android, iOS, and webOS 和Mobile Browser Cache Limits, Revisited。 appcache 中的项目将在电源循环和其他浏览器缓存可能无法自动清除的情况下存活。

所以答案是：视情况而定。是否值得在您的网站上进行，只有您通过一些测试才能确定。

关于您的后续问题：我希望存储在这方面提供与 appcache 相同的优势，不同之处在于您必须编写的代码量以在客户端自己管理内容比绝对性能。

【讨论】：

关于后续问题，我认为 localstorage 的主要优势可能是解决了缓存页面本身和能够“轻松”重新加载任何项目的问题。所有的大佬都在做——stevesouders.com/blog/2011/09/26/app-cache-localstorage-survey他们一定是对的
@CarlosOuro 我认为存储的主要优点是它不会弹出一个可怕的对话“这个页面想要存储东西以供离线使用”，而且存储具有更广泛的浏览器支持（它在毕竟IE8）。除此之外，您只是重新实现了通过 appcache 免费获得的 JavaScript 功能。对于排名前 10 的网站来说，有各种“正确”的东西不一定适合 your 网站。