序言
压缩：Accept-Encoding <-> Content-Encoding
Browser利用本地缓存：
Last-Modified <-> If-Modified-Since （-> 304）：每次均会进行http请求确认
Expire: 在有效期内不会进行任何http请求
Keep-Alive: 基于单个socket，可以进行多个http请求
http1.1 管道：性能优于Keep-Alive，但不是所有浏览器都支持（具体待查？）
减少Http请求
Image Map: 只能是矩形区域
Css Sprites
Inline images：
基于data:[<mediatype>][;base64],<data>，实质就是讲图片进行编码，直接以字符串格式写入html或者css中。注意：data:[<mediatype>][;base64],<data>可以支持a、script等所有url。
缺点：不被IE支持（IE7-，IE8+待查？）；编码大小受限制
合并脚本和样式表
使用Content Delivery Network
使用Expires头
Expires缺点：
使用一个具体的特定时间，要求服务器时间和客户端时间严格同步；
服务器端过期时间需要经常检查并且更新。
Cache max-age: 需要支持Http1.1的浏览器
哪些浏览器默认用的还是http1.0？
压缩组件
原理：
Request Header: Accept-Encoding：gzip, deflate -> Response: Content-Encoding: gzip
(注意：gzip是标准，更通用)
代理缓存：
给服务器的Vary响应头包含上：Accept-Encoding
将样式表放在顶部
将脚本放在底部
Http1.1规范建议浏览器从每个主机名并行下载2个组件，IE默认设置为2个，FF默认设置为8个；
下载Js时，为了保证js按照正常顺序加载执行，禁用并行下载。
避免CSS表达式
所谓的css表达式， 即在css中通过expression方法接受一个javascript表达式来动态设置css样式。如：background-color:expression(new Date().getHours() % 2 ? “#ccc” : “#fff”); ；
注意：css expression只被IE识别，被其他浏览器所忽略；
表达式功能强大，但性能低下。
避免方法：
一次性表达式（js定义方法，css引用），如：width：expression(setWidth(this));
事件处理；
使用外部CSS和Javascript
内联 VS 外部
加载后下载：
将不公用的css、js内联，将公用的通过js在onload事件中基于setTimeout延迟加载（可以将该操作独立到一个隐藏的iframe中，这样不会影响页面正常显示）。
动态内联：
检查cookie是否存在，存在则直接引用外部css&js（cookie存在，正常情况下css&js均在缓存中，即使被清楚，也不过是真正去请求下载）；不存在，则先内联css&js，减少http请求数，尽快加载渲染页面，然后基于加载后下载技术下载外部css&js，并且写入cookie（当cookie不存在但css&js已在缓存中时，浏览器不会真正去下载css&js）
减少DNS查找
减少站点唯一主机名 & 使用Keep-Alive；
权衡组件并行下载数 和 DNS查找数建议： 组件分布到2~4个主机名.
精简Javascript
精简工具：
Jsmin：http://crockford.com/javascript/jsmin
Shinksafe: http://shrinksafe.dojotoolkit.org/
避免重定向
301 VS 302
Baidu搜索结果列表通过onmousedown来做流量统计；
Yahoo通过动态建立一个img，然后设置src路径为后端统计程序。
移除重复脚本
配置或者移除ETag (Entity Tag)
完整过程：
Request -> Response: ETag: “***…” -> Re Request: If-None-Match: “***…” -> Response: 304 Not Modified
缺点：
默认情况下，ETag通常根据服务器某些属性来产生，同已组件在IIS、Appache集群不同机器上产生的ETag可能不一样。而If-None-Match优先级高于If-Modified-Since，导致服务器集群时缓存利用率极低。
建议：
重写或者移除ETag
使Ajax可缓存
如果业务许可，可以增加长久的Expires头