浏览器缓存机制(四)——sessionStorage和localStorage

一.Web Storage

Web Storage是HTML5提出的本地存储机制，主要目的是克服cookie的一些限制，当数据需要被严格控制在客户端上时，无需持续的将数据发回服务器。

优点：

• 大量数据的存储（也有限制，因浏览器而异，每个来源2.5M/5M）
• 数据不是由每个服务器请求传递的，而是只有在请求时使用数据。它使在不影响网站性能的情况下存储大量数据成为可能。
• 跨会话

缺陷:

• 因为WebStorage API属于一种同步API,所以在保存大数据量或保存对象时的性能不高。
• 因为缺乏索引,所以在针对大数据量或对象进行搜索时的性能不高。
• 因为目前主流浏览器均只支持在WebStorage中存储字符串数据,所以当保存对象时必须先将其转换为JSON字符串后进行保存,当获取对象时必须先将取出的字符串后将其还原为对象,所以导致针对对象进行存取操作时的性能不高。

分类：

Web Storage提供了两种在客户端存储数据的方法：

• localStorage - 没有时间限制的数据存储
• sessionStorage - 针对一个 session 的数据存储

浏览器兼容性：

localStorage， sessionStorage都是浏览器的对象，绝大部分现代浏览器中已经得到了很好的支持，但是既然是绝大部分，就必须照顾那些还不支持这两个对象的浏览器。为了检测浏览器是否支持这两个对象，我们可以简单的用下面的代码来检测：