优化关键渲染路径(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/
网友评论