Html5中应用程序缓存技术-Cache manifest

遇到过好几次项目网站打开速度慢需要优化问题，那么在之前我也说过，在你代码写的并非十分稀烂，图片、js、css文件已经压缩情况下，剩下的问题基本都是接口和服务器问题，而前端所能优化占比通常只占30%（个人认为），尽管如此，但如果你在公司里，很多产品经理甚至测试会优先找前端，谁让页面是前端写的呢，没办法这锅不想背都有点难。

前段时间看到一个h5离线应用程序缓存，也就是标题中所说的Cache manifest，下面看下这东西大致能干嘛，基本用法。

如何使用

如何配置

同目录下新建manifest.appcache文件，配置如下：

工作原理

manifest会在首次下载并按文件规则缓存资源，再次载入页面时，便会根据 manifest 中规定的缓存文件使用本地缓存而不是请求服务器资源，当 manifest 文件更新时，页面加载已经进行，但是缓存更新尚未完成，便会先使用旧 manifest 所缓存的文件，同时浏览器会将新的 manifest 文件里的缓存文件下载下来，若想看到最新的静态资源需要刷新下页面重新加载一次 。

小结

这东西固然能再一定程度上让页面加速渲染，但所有缓存技术带来的问题也不言而喻，对开发者相当不友好，比如你改了css或者js，无法及时看到更新效果。并且缓存网站资源的话原本浏览器的缓存机制（304）已经很好了，没必要再使用 manifest 做缓存；实际上因为使用反响并不好，W3C正在废弃manifest。