移动web和移动app一直都是在其各自的领域内，各司其职，井水不犯河水。web端只要有浏览器，便能看遍天下网站，但是完全离不开网络，app则强大到无所不能，但是用必须要下载。各有各的优势，各有各的局限，直到html5的出现，两者的界限不断被刷新，webapp开始被广泛使用。说到这里，不得不提到h5中推出的一个离线缓存的新特性，正是它，大大拉近了web与app的距离。废话不多说，开讲--manifest
一、如何使用
接触过h5和安卓的同学，应该都有一种感觉，h5就是在模仿app干的事，Android里面也有个小伙伴叫做manifest。离线缓存中最主要的就是这个xxx.manifest文件，我一般起名叫做cache.manifest，文件格式如下：
CACHE MANIFEST
#v1.2.0
CACHE:
bbs_detail_app.css
bbs_detail_app.js
zepto.js
NETWORK:
*
FALLBACK:
index.html offline.html文件必须以CACHE MANIFEST开头，接下来是记录的版本号，#v（version），至于版本号的格式似乎是没有特别的界定的，只要不同版本有区别即可。
接下来看到的是CACHE，表明以下的文件是会在客户端进行缓存的文件，且一行记录一个文件名，CACHE关键字可以去掉，除了最顶上两行manifest以及版本说明外，列在最上面的文件默认是缓存文件，NETWORK后的文件表示每次都需要从网络去取，若CACHE中定义的文件名与NETWORK中有重复的，则先在缓存中取，若缓存中没有，则从网络中取得。FALLBACK定义的文件是当index.html文件读取失败，则用offline.html代替。
HTML页面中的调用如下：
<html manifest="cache.manifest">是不是觉得很厉害，
但是离线缓存更加适用于资源异步加载的静态页面，在离线缓存中，URL严格相同的页面才会被认为是同一个请求，缓存才会起效，
例如两个地址一致的url：url1：http://test.com/test.html?id=1；url2：http://test.com/test.html?id=2；
这两个其实并不是同一回事，当url1进行缓存后，访问url2时，不会使用请求url1时的缓存。因此，若使用此利器，最好页面静态化，保持页面请求url时一致，所有资源请求使用ajax进行异步请求。
另外，使用离线缓存还有一个优势，可以很大程度帮助我们解决浏览器端的缓存问题，只要manifest版本信息不变，永不更新，我们想要更新资源，只需要更新版本号即可，特别是在移动端缓存的清理一直是个问题，很有帮助。
二、缓存的更新机制
manifest离线缓存使用过程中会出现一点点问题，这里我们分析一下他的缓存加载以及更新机制。当用户第一次加载，浏览器会请求包括manifest在内的所有文件，并对manifest中的内容进行解析，该缓存的缓存。下次请求的时候，首先从缓存中取出manifest文件，里面记录需要缓存的文件会直接从缓存中读取出来，然后去网络请求网络中的manifest以及其他需要的文件，最后，会进行manifest的版本对比，若版本不变，则没啥变动，若manifest版本有所变化，那则会继续请求网络取出需要缓存的文件进行本地缓存的更新，但是此时，已经渲染的页面不会进行重新刷新，所以即使服务端更新manifest后，客户端刷新第一次其实取得还是上一次缓存的文件，第二次刷新才是服务端更新后的文件，这是离线缓存刷新机制所决定的，会有一点体验上的问题，但是这个问题我们可以用代码进行手动缓存的刷新解决，调用cache.update()进行缓存刷新，cache.swapCache()进行重新请求更新的资源进行渲染。
以上是个人在项目以及学习中的一些浅显的总结，在此分享一下，若有失误，请指出。