优化关键渲染路径

Ilya Grigorik

发布时间：2014 年 3 月 31 日

为了尽可能缩短首次呈现时间，我们需要尽量减少以下三个变量：

• 关键资源数量。
• 关键路径长度。
• 关键字节数。

关键资源是指可能会阻止网页的初始渲染的资源。这些资源越少，浏览器、CPU 和其他资源的工作量就越少。

同样，关键路径长度是关键资源及其字节大小之间的依赖图的函数：某些资源下载只能在处理完先前资源后启动，并且资源越大，下载所需的往返次数就越多。

最后，浏览器需要下载的关键字节越少，它处理内容并将其呈现在屏幕上的时间就越短。为了减少字节数，我们可以减少资源数量（将其移除或设为非关键资源），并通过压缩和优化每个资源来确保尽可能缩减传输大小。

优化关键渲染路径的一般步骤顺序如下：

1. 分析和描述关键路径：资源数量、字节数、长度。
2. 尽量减少关键资源的数量：消除关键资源、延迟关键资源的下载、将关键资源标记为异步，以及其他重要注意事项。
3. 优化关键字节数，以缩短下载时间（往返次数）。
4. 优化其余关键资源的加载顺序：尽早下载所有关键素材资源，以缩短关键路径长度。

反馈