【浏览器性能优化】优化关键渲染路径——综述

优化关键渲染路径(CRP,Critical Rendering Path),指的是:优先响应用户的动作(点击,拖动,双击等)

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

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

【浏览器性能优化】优化关键渲染路径——综述_第1张图片
优化前和优化后对比.png

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

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

你可能感兴趣的:(【浏览器性能优化】优化关键渲染路径——综述)