码迷,mamicode.com
首页 > 其他好文 > 详细

前端性能优化-Cookie

时间:2016-02-01 13:36:39      阅读:262      评论:0      收藏:0      [点我收藏+]

标签:

什么是Cookie

Cookie可以理解成为浏览器内部存储数据的一个数据库,并会随请求一起被发送;Cookie以键-值对的形式存在。可以存储网站的一些数据,这部分数据不会随着浏览器关闭而被清除。如下图为cnblogs的Cookie的形式。

技术分享

Cookie有哪些优势和不足

Cookie的优势是全系列浏览器全部支持,而且可以不传递参数的情况下与后台进行数据交互,最典型的例子就是自动登录。

Cookie的不足就很多了

  1. IE老版本浏览器会有50个限制,超出会被新的Cooke替换
  2. 如果域名设置不当,所有请求都会带上Cookie信息,包括图片、css文件等,造成不必要的流量浪费
  3. Cookie的读写性能非常非常的差

有一个小例子来证明上述的观点,点我

  1. 在例子中先点击增加Cookie数据,把Cookie写到浏览器中,再点击获取Cookie数据,数据就会被打印到页面上,我们看下Chrome浏览器和IE6浏览器的差异。可见,Chrome是正常全部取出,IE6的前50个已经被替换了,取值为空。技术分享 技术分享
  2. 当我把域名设置为:主域名和二级域名时,我们看下静态资源的加载情况

技术分享  技术分享

  1. 我们看一下Cookie在IE6和Chrome下的读写差别;可见,不论现代浏览器还是老版浏览器,性能都非常差

技术分享 技术分享

技术分享 技术分享

Cookie的解决方案

  1. 尽量的少使用Cookie,最好能使用变量来替换
  2. 使用LocalStorage存储数据(兼容IE6),点我

前端性能优化-Cookie

标签:

原文地址:http://www.cnblogs.com/sunhk/p/5174493.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!