附加外部js和CSS文件中的页面速度

Question

我只是想知道谁的文献记载清楚，如果我要在我的网站上附加10个js / css外部文件，则最好将它们压缩成1个文件，或者无论如何都应具有10,20个外部源链接页面速度的观点？

我也问这个问题，导致同时使用Firebug谷歌页面速度工具和yahoo Yslow页面速度工具，它们在此发生冲突，谷歌表示要分离文件，雅虎说要全部压缩成一个：| ..通常我会相信bigG，但谁知道：|

Answer 1

您可以进行的关键性能增强之一是减少HTTP请求的数量。 每个外部资源意味着一个额外的请求，因此将它们组合在一起将对页面性能产生积极影响。

如果您想了解有关前端性能的更多信息，请查阅Steve Souders的书。 您可以在Yahoo!的书中找到有关主题的简化概述。 开发者网络 （写第一本书时他在Yahoo!上）。

Answer 2

首先，压缩文件（几乎）总是一个好主意。 使用特定的JS和/或CSS压缩器，以及在HTTP级别使用GZIP压缩。

决定是否合并文件不是那么容易。 您需要兼顾不同的目标：

1. 最小化加载的字节总数； 这包括确保可以从缓存中检索文件
2. 确保装入的文件在尽可能少的请求中到达。

合并文件针对＃2进行了优化，但代价是＃1。 如果不同的页面使用不同的CSS / JS，则每个页面可能会获得不同的组合文件（组件文件的排列），从而无法进行缓存。

一种快速解决方案是将所有通用JavaScript和所有页面上使用的所有CSS包含在两个单个压缩文件中（一个JS，一个CSS）。 如果您的访问者在您的网站上停留更长的时间，他们将获得最好的体验，因为所有CSS / JS只需要加载一次，并且一次加载越快越好。

Answer 3

如果将脚本合并到一个主机上的一个脚本中，并且该主机运行缓慢-您的页面将运行缓慢。 如果您将脚本分解为CDN上托管的几个脚本，这些脚本具有不同的子域，则您的浏览器将并行下载更多脚本。 阅读有关增加下载时间的站点。 它的结论是：“增强并行下载可以使网页延迟最多提高40％。您可以使用两个或三个主机名来提供来自同一服务器的对象，以使浏览器欺骗更多对象的多线程。”

Answer 4

确保已安装Google Page Speed，YSlow和Firebug插件，然后再使用它们。 他们将帮助您加快网站速度。