Web前端性能优化全攻略..docVIP

Web前端性能优化全攻略Web 前端性能优化是个大话题，是个值得运维人员持续跟踪的话题，是被很多网站无情忽视的技术。Yahoo! 的 Exceptional Performance team 在 Web 前端方面作出了卓越的贡献。广为人知的优化规则也由 13 条到 14 条，再到 20 条，乃至现在的 34 条--真是与时俱进啊。最新的 34 条也针对不同的角度做了分类。 面向内容的优化规则目前有 10 条。 1. 尽量减少 HTTP 请求 (Make Fewer HTTP Requests) 作为第一条，可能也是最重要的一条。根据 Yahoo! 研究团队的数据分析，有很大一部分用户访问会因为这一条而取得最大受益。有几种常见的方法能切实减少 HTTP 请求： 1) 合并文件，比如把多个 CSS 文件合成一个； 2) CSS Sprites 利用 CSS background 相关元素进行背景图绝对定位；参见：CSS Sprites: Image Slicings Kiss of Death 3) 图像地图 4) 内联图象 使用 data: URL scheme 在实际的页面嵌入图像数据. 2. 减少 DNS 查找 (Reduce DNS Lookups) 必须明确的一点，DNS 查找的开销是很大的。另外，我倒是觉得这是 Yahoo! 所有站点的通病，Yahoo！主站点可能