Cookie

1. cookie：文本类型文件；存储在本地硬盘上，一般由浏览器应用程序打开。
2. cookie特性：当浏览器向服务器发送请求时，会被同时发送到服务器进行身份验证。当cookie没有设置过期日期时，会在浏览器关闭时，自动清除。
3. cookie的格式：以键值对的形式存在，与json不同的是，键值对是以等号连接的。如：“key=value”
4. cookie特点：大小：4kb，一个域名下最多50个cookie存在
5. cookie的设置：document.cookie = “user=tom”
6. cookie的读取：document.cookie
7. cookie的删除：cookie的删除都是以设置cookie存在的日期过期后来实现的。cookie过期设置：如七天过期：document.cookie = 'username=tom; expires="new Date().getTime()+"7*24*3600*1000"'
8. cookie与localStorage、sessionStorage
   localStorage：本地存储；sessionStorage：会话存储
   会话存储：同一个会话（如：同一个网站）有效，网页关闭时一定消失
   本地存储：所有会话都可以访问，也存在本地硬盘上，如果不是手动删除，否则不会消失
   1）大小：
   cookie：存储大小的限制，4kb
   localStorage、sessionStorage：存储大小的限制，但比cookie大得多，可以达到5M或更大。
   2）有期时间：
   localStorage 存储持久数据，浏览器关闭后数据不丢失除非主动删除数据；
   sessionStorage 数据在当前浏览器窗口关闭后自动删除。
   cookie 设置的cookie过期时间之前一直有效，即使窗口或浏览器关闭
   3）特性：
   cookie：
   当浏览器向服务器发送请求时，会被同时发送到服务器进行身份验证。当cookie没有设置过期日期时，会在浏览器关闭时，自动清除。
   localStorage、sessionStorage：
   sessionStorage和localStorage不会自动把数据发给服务器，仅在本地保存
9. 优化网页资源：可以将js或者存储在localStorage上，页面加载时如果本地存储存在，优先读取本地资源，无需再在服务器读取资源
10. 性能优化的几种常用方式：
    1） 减少http请求次数：CSS Sprites, JS、CSS源码压缩、图片大小控制合适；网页Gzip，CDN托管，data缓存 ，图片服务器。
    2） 前端模板 JS+数据，减少由于HTML标签导致的带宽浪费，前端用变量保存AJAX请求结果，每次操作本地变量，不用请求，减少请求次数
    3） 用innerHTML代替DOM操作，减少DOM操作次数，优化javascript性能。
    4） 当需要设置的样式很多时设置className而不是直接操作style。
    5） 少用全局变量、缓存DOM节点查找的结果。减少IO读取操作。
    6） 避免使用CSS Expression（css表达式)又称Dynamic properties(动态属性)。
    7） 图片预加载，将样式表放在顶部，将脚本放在底部 加上时间戳。

//创建cookie
function setCookie(name, value, expires, path, domain, secure) {
    var cookieText = encodeURIComponent(name) + '=' + encodeURIComponent(value);
    if (expires instanceof Date) {
        cookieText += '; expires=' + expires;
    }
    if (path) {
        cookieText += '; expires=' + expires;
    }
    if (domain) {
        cookieText += '; domain=' + domain;
    }
    if (secure) {
        cookieText += '; secure';
    }
    document.cookie = cookieText;
}
//获取cookie
function getCookie(name) {
    var cookieName = encodeURIComponent(name) + '=';
    var cookieStart = document.cookie.indexOf(cookieName);
    var cookieValue = null;
    if (cookieStart > -1) {
        var cookieEnd = document.cookie.indexOf(';', cookieStart);
        if (cookieEnd == -1) {
            cookieEnd = document.cookie.length;
        }
        cookieValue = decodeURIComponent(document.cookie.substring(cookieStart + cookieName.length, cookieEnd));
    }
    return cookieValue;
}