美文网首页技术干货程序猿阵线联盟-汇总各类技术干货
【浏览器性能优化】优化关键渲染路径——综述

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

作者: Raynor_Chan | 来源:发表于2017-08-26 20:04 被阅读0次

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

    相关文章

      网友评论

        本文标题:【浏览器性能优化】优化关键渲染路径——综述

        本文链接:https://www.haomeiwen.com/subject/rxrvdxtx.html