HTML 5强大功能揭秘：应用程序缓存让你无网也爽翻天

唉互联网发展得真快！HTML 5提供个厉害功能叫“应用程序缓存”，你可以在没网时无碍地使用网站。下面我来详细说说如何设置缓存以及它有啥好处。

理解manifest文件

首先，咱得弄清楚啥叫 manifest 文件。其实就是个超简单的文本文件，告诉我们哪些东东要放根本士缓文件夹里，然后哪些不能。这个文件主要由三部分组成：CACHE MANIFEST，NETWORK 和 FALLBACK。重点还是看 CACHE MANIFEST这一块儿，这行文字就要告诉浏览器需要保存哪些资源，比如说 CSS 文件、图片、JavaScript 文件等等。等浏览器读完这个文件后，它就会跑去网上把这些资源全都下载下来，放到咱们电脑的本地缓存里面。这样的话，就算没网络也能马上用它们！

优势与注意事项

CACHE MANIFEST
/theme.css
/logo.gif
/main.js

APP缓存好在哪儿？首先，它能让我们在没网络时也能浏览网页啦；再来，万一断网了，浏览器也能用这个缓存的东西，不用怕页面加载失败咯；最后，虽然跟Cookie有点像，但是HTML5缓存还是需要依赖服务器帮忙才行。

首先记住，改manifest文件时要注意白名单和NETWORK设置要给某个资源开权限就用“*”；不想让某个文档在没网时打开，就在那儿说让它别缓存。还有就是备用方案（FALLBACK），要是断网了，就会展示备选资源。

NETWORK:
login.asp

创建简易IIS服务器

ALLBACK:
/html5/ /404.html

想要给HTML5网页添加离线存储功能？那就试试IIS服务器小工具！把这玩意儿扔进项目文件夹跟着提示走，瞬间给你搞出个模拟服务器环境，方便你测试离线Web应用。

case/
  |-- index.html
  |
  |-- demo.appcache
  |
  |-- 简易IIS服务器.exe
  |
  `-- image
        |-- 01.jpg
        `-- 02.jpg

更新manifest文件

想更新缓存？直接换个 manifest 文件里的资源版本号就搞定啦～刷新页面就能看到新东西出现！但是得注意，网站加载 Manifest 文件挺费时间的，更新完后得多刷几次，省得你以为没变！为了方便观察，推荐你去控制台看看缓存信息和更新过程哈。

CACHE MANIFEST
#v01
image/01.jpg
NETWORK:
*
FALLBACK:
/

解决用户体验问题

虽然HTML5很牛，能让手机里的程序把数据存下来，但有时候用起来确实麻烦。比如更新完APP后，还得着急忙慌地进去确认有没有新的东西出来。为了解决这个困扰，HTML5专门搞出了一个JavaScript API接口，就像个小闹钟一样可以自动提醒你要刷一下页面！

总的来说，用HTML5弄个网页应用的离线版，让用户用着轻松点儿，速度也嗖嗖滴快起来！别忘了搞好cachemanifest文件，理解下应用缓存到底是啥玩意儿，更要掌握好那些API接口，这些可是让网页应用离线化的关键步骤！

。