雅虎14条Web性能优化规则
简介：
雅虎军规总结了14条前端性能优化核心原则，涵盖减少HTTP请求、使用CDN、资源压缩、缓存配置、脚本与样式加载优化等方面，旨在提升网页加载速度与用户体验，是前端性能优化的经典指南。
- 雅虎军规
1.1 14条雅虎军规
- 减少Http请求
- 使用CDN（内容分发网络）
- 添加Exprire/Cache-Control头
- 使用Gzip压缩
- 将Css放在页面的最上面
- 将script放在页面的最下面
- 经量避免使用Css Expressions(CSS表达式)
- 将脚本文件和样式文件都放在外部文件中
- 减少DNS查找
- 最小化JavaScript和Css
- 避免重定向
- 移除重复的脚本
- 配置实体标签ETag
- 使用Ajax缓存
1.2 性能优化概况
● 网络部分
○ 尽量减少HTTP请求数
■ 合并文件
■ 雪碧图
■ 小图Base64
○ 减少DNS查找
■ 开启DNS预解析
○ 使用CND静态资源服务器
○ 避免重定向
○ 杜绝404
● 缓存
○ 配置ETags
■ 实体标签（ETags），是服务器和浏览器用来决定浏览器缓存中组件与源服务器中的组件是否匹配的一种机制
○ 添上Expires或者Cache-Control HTTP头
○ 使用外链的方式引入JS和CSS（缓存）
● 内容部分
○ 按需加载组件
○ 预加载组件
○ 减少DOM元素的数量
○ 尽量少用iframe
○ 压缩JavaScript和CSS（代码层面）
● CSS 部分
○ 避免使用CSS表达式
○ 选择而不是@import
○ 避免使用滤镜
○ 把样式表放在顶部
● JS 部分
○ 把脚本放在底部
○ 去除重复脚本
○ 减少DOM访问
● 图片部分
○ 选用合适的图片格式
○ 雪碧图中间少留空白
○ 不要用HTML缩放图片，要小图就去加载小图
○ 用小的可缓存的favicon.ico
● cookie
○ 给cookie减肥
■ 清除不必要的cookie
■ cookie尽可能小
■ 设置好合适的域
■ 合适的有效期
○ 把静态资源放在不含cookie的域下
■ 当浏览器发送对静态图像的请求时，cookie也会一起发送，而服务器根本不需要这些cookie。
● 移动端
○ 保证所有组件都小于25K
○ 把组件打包到一个复合文档里
● 服务器
○ 开启Gzip等压缩
○ 避免图片src属性为空（为空浏览器也会向服务器发送另一个请求）
○ 对Ajax用GET请求
○ 尽早清空缓冲区
○ 使用CDN（内容分发网络）
■ 内容分发网络（CDN）是一组分散在不同地理位置的web服务器，用来给用户更高效地发送内容。
