首先这篇文章不是我原创的，当然我也不是标题党 -_-，只是这几天杭州天气好冷，周末一直宅在宿舍，挖了一些 Y! UE Blog 的老文章在看，其中有几篇三年前的关于前端优化的文章挺不错，百度了一下好像还没有译文，这里献丑翻译了一把，原文于此：http://yuiblog.com/blog/2006/11/28/performance-research-part-1/

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝废话分隔线＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

这是指导如何优化网页性能系列文章的第一篇，可能你会奇怪为什么你会在 YUI Blog 上阅读到一篇关于性能的文章，但其实大多数网页性能是由前端（即 UI 的设计和开发）来决定的。

毫无疑问对用户来说网站响应越快越好。我工作在 Yahoo! 内的一个着重于考量和优化性能的专业团队里，我们工作的一部分，是做与网站性能相关的实验，现在我们分享我们的发现希望帮助更多前端工程师提升网站的用户体验。

二八性能原则

早在二十世纪初，意大利经济学家柏拉图提出一个著名报告，一个国家里 80% 的财富都掌握在 20% 人的手中，这就是后来的柏拉图法则（也称为二八原则），这个原则普遍存在各种社会现象中，如 80% 的结果来自 20% 的原因。在软件工程中，80% 的运行时间会被浪费在 20% 的代码中，因此我们优化程序的时候，应该把注意力放在这 20% 的代码上，这同样适用在网页优化中。现时大多数性能优化都放在产生 HTML 文档上，但那仅仅只占用用户响应时间的 20%，我们最好把优化集中在另外的 80% 上。

利用数据包嗅探器，我们发现了在另外的 80% 时间里发生了什么。图一是在空缓存的状态下加载 http://www.yahoo.com 的时间消耗的图表，每一横条代表一个特定的组件及浏览器的装载顺序。第一条横条表示浏览器装载 HTML 文档所消耗的时间，这包括了从服务器生成 HTML 文档到响应到浏览器，而这仅占了整个装载时间的 10%，而剩下的 90% 时间会消耗在装载页面上的图片、脚本以及样式表。

图一：装载 http://www.yahoo.com

表一列出了一些流行的网站的页面装载时间消耗，可以看出它们装载 HTML 文档的时间消耗在 5% 和 38% 之间，其余的部分用于请求页面上的组件（如图片，脚本，样式表等）。因此当页面上有相当多组件时，性能将更加恶化。事实上浏览器在下载组件时，对每一个主机名会采用 2-4 线程并发下载，但这需要依赖于 HTTP 版本和浏览器类型。我们的经验表明减少 HTTP 请求数能最有效地减少页面响应时间，这通常也是性能优化的最简单方法。

为什么不总把组件都保存到浏览器缓存呢？

答案还是一样：减少 HTTP 请求数能最有效地减少页面响应时间，也是最简单的方法。在下一篇中我们将讲述缓存的影响以及一些惊人的发现。

声明：丰富的视觉设计会与减少请求数相违背。当你需要丰富的视觉时，尽管可以通过压缩 JS 文件、使用 CSS Sprites 等方法，但是狭窄的 HTTP 请求通道总不能满足丰富的视觉设计。