雅虎性能优化14条军规

请求数量

合并脚本和样式表

HTTP 请求需要开销,合并脚本和样式表可以减少请求的次数

CSS Sprites

CSS 雪碧图,也称 CSS 精灵,原理是把多张图片文件整合至一张文件中,进而减少 HTTP 请求,使用时利用 CSS 的相关属性(background-image、background-repeat、background-position等)组合进行图片背景定位，即可精确的定位出背景图片的位置 （http://www.w3schools.com/css/css_image_sprites.asp） 图片较多的页面也可以使用 lazyLoad 技术进行优化。

划分主域

在 HTTP/1.x 协议中「浏览器客户端在同一时间，针对同一域名下的请求有一定数量限制。超过限制数目的请求会被阻塞」（参考：RFC-2616-8.1.4 Practical Considerations）而不同浏览器对该限制的数目也不尽相同（参考：Roundup-on-parallel-connections），划分主域、配置静态资源专用域（static.example.com），目的就是变相的解决浏览器针对同一域名的请求限制阻塞问题。但不易过多，否则 DNS 的查询时间也是个问题。

请求带宽

开启 Gzip

服务端启用 Gzip 可以有效的减少数据传输量，Gzip 对于基于文本的文件（CSS、JavaScript、HTML）压缩效果最好，所有现代浏览器都支持 Gzip 压缩并将自动请求该压缩

精简 JavaScript，移除重复脚本

线上的代码进行压缩混淆，移除所有不必要的空白字符(空格，换行，制表符)，使用更短的变量名函数名，减少文件大小

缓存利用

数据库缓存

为了提供查询的性能，会将查询后的数据放到内存中进行缓存，下次查询时，直接从内存缓存直接返回，提供响应效率。比如常用的缓存方案有memcached等。

代理服务器缓存

浏览器与服务器的中间部分，运作原理跟浏览器的运作原理差不多，只是规模更大。可以把它理解为一个共享缓存，不只为一个用户服务，一般为大量用户提供服务。

浏览器端的缓存规则

在HTTP协议头和HTML页面的Meta标签中配置，强缓存：Cache-Control、Expires，协商缓存：Last-Modified、ETag

页面结构

样式表置顶、JavaScript 置底，避免空src，延迟加载JavaScript等

代码校验

CSS

避免使用@import，不能并行下载；避免CSS表达式，计算频率很高；避免通配选择器，从右往左匹配；

JavaScript

使用事件委托；缓存选择器查询结果；避免频繁的DOM操作

预加载

Web标准提供了一种DNS预解析技术，因为服务器是知道页面即将会发生哪些请求的，那我们可以在页面顶部，插入 ，让浏览器先解析一下这个域名。那么，后续扫到同域的请求，就可以直接从DNS缓存获取了。