网站优化：为什么合并文件能提升速度？

Question

我读到过将所有CSS文件合并成一个大文件，或者将所有脚本文件合并成一个单独的脚本文件可以减少HTTP请求次数，从而提高下载速度。

但是我不理解这个说法。我认为如果你有多个文件（在现代浏览器上限制为10个），浏览器会并行下载它们，从而减少总下载时间（除以允许的连接数）。

显然我缺少关键信息。有人能解释一下吗？

- Joda Maki

---

通常浏览器和服务器端的并行下载都有非常严格的低限制；此外，请求本身也是昂贵的。这就是为什么通常最好只有一个大文件。 - Pekka

进一步说明，限制通常为2。请记住，将所有内容合并到一个文件中可能不是个好主意。如果有脚本或CSS需要频繁更新，则最好将其剥离出来或合并到单独的文件中。否则，您的访问者将不断重新下载一个巨大的文件。 - simshaun

查看此处以获取具体数字: http://www.die.net/musings/page_load_time/ @simshaun：这在 Cthulhu 中曾经是这样，但在 IE8 中已提高到 6。 - Piskvor left the building

这些是答案！把它们作为答案放置？还是作为一个编辑过的答案？ - user241244

Answer 1

每个请求/响应中都存在开销。这基本上就是问题的关键。

以下是向Google发送请求头的示例...

GET http://www.google.com/ HTTP/1.1 Accept: application/x-ms-application, image/jpeg, application/xaml+xml, image/gif, image/pjpeg, application/x-ms-xbap, application/vnd.ms-excel, application/vnd.ms-powerpoint, application/msword, application/x-shockwave-flash, / Accept-Language: en-US User-Agent: Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.1; WOW64; Trident/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 Connection: Keep-Alive Host: 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和图像文件组成。理想情况下，您需要合并相当多的内容以优化网站。

- Steve Wortham

Answer 2

几个要点：

• TCP建立和拆除 - 随着keep-alive和pipelining的广泛使用，这个问题已经不再那么重要了，除了一些代理出于兼容性原因仍然采用“一个HTTP请求-一个TCP连接”的模式。
• HTTP头开销 - 对于小文件来说，这可能是相当大的开销 - 几百字节的头部可能比响应体还要大。
• 延迟（从请求开始到响应开始的时间） - 这在使用keepalive和pipelining时有所减少。
• 并行下载的限制 - 这是其中最主要的问题。IE6曾将此限制为每个主机名2个连接，IE8将其提高到6个（其他浏览器早已有合理的限制）。请参见这篇较旧的研究，以进一步进行并行化处理（“使用4个域名而不是1个”）。

- Piskvor left the building