为了提高网站加载速度，我们应该瞄准啥：减少 http 请求/节省整体页面大小？

Posted 2023-03-10

【中文标题】为了提高网站加载速度，我们应该瞄准啥：减少 http 请求/节省整体页面大小？

【英文标题】：To increase site loading speed what should we aim at: decreasing http requests / saving overall page size?为了提高网站加载速度，我们应该瞄准什么：减少 http 请求/节省整体页面大小？

【发布时间】：2011-09-27 10:19:21

【问题描述】：

（我的网站有 110Kb 的图片，一个旋转器，2 个谷歌字体）

我的 Wordpress 网站发出 30 个 http 请求，加载时间为 7 秒，总页面大小为 220Kb。通过更改各种插件，我设法将请求减少到 22、6.1 秒，页面大小膨胀到 320Kb（2 个 google 字体归类为 CSS 图像，由 websiteoptimisation.com）

因为压缩和合并 .js 无疑会减小文件大小，但它会位于中间阻塞所有内容。

我尝试了各种脚本压缩器，但结果相似。仍然 Yslow 和 PageSpeed 对缩小文件大喊大叫（这个文件本来可以压缩 40%...）

我的问题是我们应该瞄准什么？减少 http 请求/缩小和合并文件/防止整体页面大小膨胀？

【问题讨论】：

您必须决定是要优化页面加载速度，还是要优化“第一个内容的时间”。这两个通常是相互冲突的。一般来说，减少请求的数量绝对有效，绝对值得将所有 JS 合并到一个文件中，然后将其缩小。 100KB 的图像听起来并不算多，尤其是如果您设置了正确的缓存标头，这样您的访问者就不需要再次加载它们。

但是，您应该配置您的应用程序。看起来下载可能不是您的网站花费 6 秒加载的罪魁祸首。 320KB 并不是很多。加载浏览器缓存后，您看到什么样的速度？

【参考方案1】：

原则上，这取决于许多因素（例如，如果您的用户带宽较低，则最好将页面大小保持在最小。） 然而，在我看来，一般来说，http 请求的数量远比页面大小重要。 请记住，现代浏览器可以缓存静态内容（.js 文件、.css 等），因此页面大小可能会随着时间的推移而减小。 如果您可以提供有关您的页面生成的请求的更多信息，也许我们可以为您提供更具体的建议。