什么是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的更多相关文章

  1. Web前端性能优化教程09：图像和Cookie优化

    本文是Web前端性能优化系列文章中的第九篇,主要讲述内容:图像和Cookie优化.完整教程可查看:  一. 图像优化 图像基础知识 gif: 适用于动画效果,例如提示的滚动条图案 jpg: 是一种使用 ...

  2. 移动H5前端性能优化指南

    移动H5前端性能优化指南 概述 1. PC优化手段在Mobile侧同样适用2. 在Mobile侧我们提出三秒种渲染完成首屏指标3. 基于第二点,首屏加载3秒完成或使用Loading4. 基于联通3G网 ...

  3. web前端性能优化指南(转)

    web前端性能优化指南 概述 1. PC优化手段在Mobile侧同样适用2. 在Mobile侧我们提出三秒种渲染完成首屏指标3. 基于第二点,首屏加载3秒完成或使用Loading4. 基于联通3G网络 ...

  4. Wen前端性能优化

    Web前端性能优化 一般说来Web前端指网站业务逻辑之前的部分,包括浏览器加载.网站视图模型.图片服务.CDN服务等.主要优化手段有优化浏览器访问.使用反向代理.CDN等. 一.浏览器访问优化 减少h ...

  5. 移动H5前端性能优化指南(转载)

    移动H5前端性能优化指南 概述 1. PC优化手段在Mobile侧同样适用2. 在Mobile侧我们提出三秒种渲染完成首屏指标3. 基于第二点,首屏加载3秒完成或使用Loading4. 基于联通3G网 ...

  6. WEB前端性能优化:HTML,CSS,JS和服务器端优化

    对前端开发工程师来说,前端性能优化的重要性是不言而喻的,最为大家所知的是YSLOW的23条优化规则,在我的理解中,性能优化不纯粹是指用户访问网站的速度,也包括开发的效率,这里我总结下我理解中的WEB前 ...

  7. Web前端性能优化的9大问题

    1.请减少HTTP请求基本原理:在浏览器(客户端)和服务器发生通信时,就已经消耗了大量的时间,尤其是在网络情况比较糟糕的时候,这个问题尤其的突出.一个正常HTTP请求的流程简述:如在浏览器中输入&qu ...

  8. WEB前端性能优化小结

    转:http://www.gafish.net/archives/1514 对前端开发工程师来说,前端性能优化的重要性是不言而喻的,最为大家所知的是YSLOW的23条优化规则,在我的理解中,性能优化不 ...

  9. 阿里巴巴 web前端性能优化进阶路

    Web前端性能优化WPO,相信大多数前端同学都不会陌生,在各自所负责的站点页面中,也都会或多或少的有过一定的技术实践.可以说,这个领域并不缺乏成熟技术理论和技术牛人:例如Yahoo的web站点性能优化 ...

随机推荐

  1. JetBrains WebStorm 如何从GitHub上克隆的代码

    工作中经常会遇到要从GitHub上拉代码,详细操作记录如下: 绑定账号 1.File->Settings->Version Control->Github 成功后会出现下面的这个账户 ...

  2. git常用命令（转）

    git常用命令: git init //初始化本地git环境 git clone XXX//克隆一份代码到本地仓库 git pull //把远程库的代码更新到工作台 git pull --rebase ...

  3. Django之高级视图与URL

    Urls.py中有我们所有的路由映射关系.但是随着网站功能的增多,需要配置的URL也变得多了起来.并且维护这些导入也变得很麻烦.因此介绍一些优化和简洁的方法: 一 使用多个视图前缀: 之前所有的路由关 ...

  4. [Algorithm]线性表

    一. 线性表基础算法 1.线性表插入操作 1 // 线性表插入操作(在第i(1≤i≤L.length+1)个位置上插入新元素elem) 2 bool InsertSeq( SeqList& L ...

  5. Android emulator中C代码的调试——gdb/gdbservers时遇到的坑

    版权声明:本文为博主原创文章,未经博主允许不得转载. 先写个helloworld吧,在Android源码树中创建文件夹external/helloworld,加入文件: // helloworld.c ...

  6. Python Flask-web表单

    Flask-WTF扩展可以把处理web表单的过程变成一种愉悦的体验. 一.跨站请求伪造保护 默认情况下,Flask-WTF能够保护所有表单免受跨站请求伪造的攻击.恶意网站把请求发送到被攻击者已登录的网 ...

  7. Codeforces Round #521 (Div. 3) C. Good Array

    C. Good Array time limit per test 1 second memory limit per test 256 megabytes input standard input ...

  8. freemarker macro 使用

    转载... macro, nested, return语法 <#macro name param1 param2 ... paramN>...<#nested loopvar1, l ...

  9. Educational Codeforces Round 13 C

    Description Little Joty has got a task to do. She has a line of n tiles indexed from 1 to n. She has ...

  10. HDU1085 Holding Bin-Laden Captive!

    Description We all know that Bin-Laden is a notorious terrorist, and he has disappeared for a long t ...