前端优化：Yahoo军规

前端

一、尽量减少HTTP请求

原理：文本、图片、JS、CSS都会产生HTTP请求；
方法：合并图片、JS、CSS。

二、使用CDN (内容分发网络)

原理：在离客户近处放置一台副本服务器，使客户能够以最近的距离、最快的速度获取内容；
方法：架设副本服务器。

三、添加Expire/Cache-Control头

原理：expire的http头定义资源在本地缓存的过期时间值；catch-control头部
操作流程和expire相似，提供更多选项和处理方式。

四、使用Gzip压缩

原理：压缩后传输，在服务器端配置，能提升文件传输速度；
方法：先压缩文件，再传输至服务器端再压缩。

五、将CSS置于页面前面

原理：提高渲染性能，避免页面空白或者重绘。

六、将JS置于页面后面

原理：根据DOM加载顺序，可以先呈现内容。

七、避免使用CSS表达式

原理：占用资源，影响浏览器性能和用户体验。

八、将JS和CSS作为外置文件引用

原理：提高复用性、可维护性，减小页面体积。

九、减少DNS查询

原理：DNS查询：访问网址(转换为IP)，时间至少20 ms；浏览器缓存：IE (30 ms)、FF (60 s)、Chrome (60 s)，缓存长可减少DNS重复查找、节省时间，缓存短可及时检测服务器的变化、保证正确性；
方法：单域或多域。

十、压缩CSS和JS

十一、避免重定向

原理：301（永久重定向，被移动到另外位置，使搜索引擎智能）；302（临时重定向，页面被找到，但不在原始位置先到旧地址，再到新地址，搜索引擎不友好）；重定向将重新请求下载资源，增加了http请求，必须避免。

十二、移除重复的脚本

原理：可以减少文件的大小，另外，就是可以避免出现未知的问题。

十三、配置实体标签 (ETag)

原理：浏览器端与服务器端比较ETag，若相同，说明未作更改，服务器返回304，即令浏览器不用请求、使用用自己的缓存，减少服务器响应。

十四、使用Ajax缓存

原理：POST每次都执行、不被缓存，GET同一域不重复执行，可以被缓存。

附：参考

慕课：Yahoo军规
YSlow基于Chrome插件