HTML5 应用缓存

HTML5 应用缓存

1. 是什么？
HTML5中我们可以轻松的构建一个离线（无网络状态）应用，只需要创建一个cache manifest文件。

2.什么特点？

• 可以离线访问缓存的css，HTML，js 等文件，
• 减少了请求，从而缓解了服务器的压力。
• 本地读取缓存的资源，提升了访问速度，增强了用户体验。
• 可以配置需要缓存的资源。

3.创建方法？

• 首先假设创建名为 demo.appcache 的文件
• 然后在应用缓存页面HTML即根元素上添加属性 manifest=“demo.appcache”,注意路径。

4.minifest 文件格式

• 顶行写CACHE MANIFEST
• CACHE: 换行 指定我们需要缓存的静态资源，如.css、image、js等
• NETWORK: 换行 指定需要在线访问的资源，可使用通配符
• FALLBACK: 当前页面无法访问时退回的页面(回退; 后退)
• CACHE: 可以省略，这种情况下将需要缓存的资源写在CACHE MANIFEST
• 可以指定多个CACHE: NETWORK: FALLBACK:，无顺序限制
• #表示注释，只有当demo.appcache文件内容发生改变时或者手动清除缓存后，才会重新缓存。
• chrome 可以通过chrome://appcache-internals/工具和离线（offline）模式来调试管理应用缓存