优化关键渲染路径（CRP，Critical Rendering Path），指的是：优先响应用户的动作（点击，拖动，双击等）。

反应快，体验佳的网站离不开浏览器的功劳，我们开发网站的时候写的是各种标记语言（Markup），然后一个个绚丽无比的网页就出现在了我们面前。那么，浏览器如何将 HTML，CSS，JS 转变为图形呈现在我们面前的呢？

想要优化网页性能，我们需要搞明白从网页内容接收到渲染成图像之间的步骤，这就是 “关键渲染路径（Critical Rendering Path）”

优化前和优化后对比.png

优化 CRP 可以让我们显著提升用户首次看到网站内容的时间。不仅如此，了解 CRP 也有助于我们优化交互中的性能问题。网页在交互时更新同样很简单——让网页更新速度保持在 60 帧/秒即可（响应时间小于16ms）。但是首先，我们先看一个简单的网页是如何渲染的。

原文链接：
https://developers.google.com/web/fundamentals/performance/critical-rendering-path/