Web优化：为什么组合文件更快？

Question

我已经读过将所有css文件合并为一个大文件，或者将所有脚本文件合并到一个脚本文件中可以减少HTTP请求的数量，从而加快下载速度。

但我不明白这一点。我认为如果你有多个文件（达到极限，我相信现代浏览器为10），浏览器会并行下载它们，从而减少下载的总时间（除以允许的连接数）。 / p>

我显然错过了一条关键信息。有人可以开灯吗？

Answer 1

每个请求/响应都有开销。这基本上归结为它。

以下是Google的请求标头示例...

  

获取http://www.google.com/ HTTP / 1.1   接受：application / x-ms-application，   image / jpeg，application / xaml + xml，   image / gif，image / pjpeg，   应用程序/ x-MS-XBAP，   应用/ vnd.ms-Excel中，   应用/ vnd.ms-PowerPoint中，   应用程序/ msword，   application / x-shockwave-flash， /   Accept-Language：en-US User-Agent：   Mozilla / 4.0（兼容; MSIE 7.0;   Windows NT 6.1; WOW64;三叉戟/ 4.0;   GTB0.0; SLCC2; .NET CLR 2.0.50727;   .NET CLR 3.5.30729; .NET CLR   3.0.30729; Media Center PC 6.0; OfficeLiveConnector.1.4;   OfficeLivePatch.1.3）Accept-Encoding：   gzip，deflate连接：Keep-Alive   主持人：www.google.com Cookie：   xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx   xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx   xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx   xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx   xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx   xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx   xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx   xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx   xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx

去年我写了一篇关于这个的文章...... http://swortham.blogspot.com/2010/03/latency-requests-css-sprites-and-you.html

你是对的，可以并行下载多个文件（单个主机名中有2个或更多，具体取决于浏览器）。而这反过来将导致页面逐步加载，这是好的。但这并不意味着您的主页应该由20多个css，js和图像文件组成。理想情况下，您需要结合很多来优化网站。

Answer 2

有几件事：

• TCP设置和拆卸 - 随着keep-alive和流水线的广泛使用，这已经不再太重要了，除了一些代理由于兼容性原因而回退到这个“一个HTTP请求 - 一个TCP连接”模型。 / LI>
• HTTP标头开销 - 这对于小文件来说可能很重要 - 数百字节的标头可能比响应主体大。
• 延迟（从请求开始到响应开始的时间） - 使用keepalive和pipelining有点减少
• 对并行下载的限制 - 这是主要的。 IE6用于将此限制为每个主机名2个连接，在IE8中它已经被提升到6（其他浏览器已经有了一段时间的理智限制）。有关进一步并行化的信息，请参阅this older study（“使用4个域名而不是1个”）。