html5初探——webapp离线策略（本地储存策略）

思客迪

今日初探了一下webapp的离线策略。确实好用！建议大家都用上！
（下面会给一个例子，但只是基于safari，chrome和firefox测试。）
开发离线应用的缓存方法大概有4种（如下safari开发工具中的resources所示）

1.cookies（略）：传统储存策略。缺点很明显：储存的容量过小，而且很容易被各种软件当垃圾清除，如360等。
2.Application Cachet资源缓存：在html中指定一个manifest文件，给文件中罗列出需要缓存的资源文件列表。浏览器根据资源列表对资源文件缓存。

3.Dom Storage：这一种基于key/value的格式。

[size=0.76em]DOM Storage 分为两类：sessionStorage 和 localStorage。除了以下区别外，这两类存储对象的功能是完全一致的。

• sessionStorage 用于存储与当前浏览器窗口关联的数据。窗口关闭后，sessionStorage 中存储的数据将无法使用。
  
• localStorage 用于长期存储数据。窗口关闭后，localStorage 中的数据仍然可以被访问。所有浏览器窗口可以共享 localStorage 的数据.
  

4.web sql Databases:

除了 DOM Storage 以外，HTML5 中还有另外一种数据存储方式 Web SQL Database。它提供了基本的关系数据库功能，支持页面上的复杂的、交互式的数据存储。它既可以用来存储用户产生的数据，也可以作为从服务器获取数据的本地高速缓存。例如可以把电子邮件、日程等数据存储到数据库中。Web SQL Database 支持数据库事务的概念，从而保证了即使多个浏览器窗口操作同一数据，也不会产生冲突。