0

如果可能的话，在一些建议/反馈之后。

我正在做一个大型项目，开发团队要求我们合并所有 JS/CSS 并将其与 memcache 一起缓存为一个文件，以加快速度。

我担心这不是我习惯的工作方式，我只想加载每个页面所需的 JS 和 CSS，我认为这是一个明显的原因。

我也一直在寻找其他一些高流量网站，但似乎没有其他人这样做。

谁能给我一些这种方法的优缺点？

提前致谢

理查德

4

1 回答 1

3

“我一直在寻找其他一些高流量的网站，但似乎没有其他人这样做”

真的吗？这让我有点吃惊……这被认为是减少页面加载时间的第一步。见这里：http: //developer.yahoo.com/performance/rules.html。如果您想测试对加载时间最佳实践的遵守情况，您可能还想尝试他们的性能测试工具 YSlow：http: //developer.yahoo.com/yslow/。

这就是为什么这被认为是最佳实践的原因：浏览器限制为大约 8 个同时连接，每个特定服务器限制为 2 个（对于不合格的浏览器更多）。因此，如果您为给定页面生成多个文件，那么它们将在某种程度上连续加载，因为您的浏览器将与您的服务器进行 15 次往返，一次两次。

那么让我们看看这是如何进行的。假设您有 15 个文件，每个文件大小为 10k，或者您可以将它们组合成一个 150k 的文件。假设服务器的延迟为 65 毫秒，下载速率仅为 25k/秒。让我们算一下......这是等式：

$page_load_time = ( ($simultaneous_connections * $load_time_per_file) 
                       + $latency_per_request ) 
                  * ($number_of_files/$request_cycles)

在哪里：

$request_cycles = max(1, ($number_of_files/$simultaneous_connections))

因此，有 15 个文件，每个文件 10k：

((2 * .4 seconds) + .065 seconds) * 7.5 =  6.4875 seconds

或使用单个 150k 文件：

((1 * 6 seconds) + 0.065 seconds) * 1 = 6.065 seconds

差别不大，但用户等待时间仍然接近半秒！

现在 - 当他们在 3g 连接时会发生什么？还是有一点 wi-fi 问题？让我们尝试更多的带宽（100k/sec）和更多的延迟（250ms）：

((2 * .1 seconds) + 0.250 seconds) * 7.5 = 3.375 seconds

或者

((1 * 1.5 seconds) + 0.250 seconds) * 1 = 1.750 seconds

哇！现在所有这些单独的小文件几乎使页面加载时间增加了一倍！

添加一大堆其他文件，你喜欢的 TypeKit 负载、广告服务器负载、Facebook 插件等等等等，这些东西开始变得更加重要。

于 2012-06-18T21:28:07.110 回答