Home > Designing, Others > Understanding the Critical Rendering Path

Understanding the Critical Rendering Path

February 1st, 2017 Leave a comment Go to comments

Ire Aderinokun:

There are 6 stages to the CRP –

  1. Constructing the DOM Tree
  2. Constructing the CSSOM Tree
  3. Running JavaScript
  4. Creating the Render Tree
  5. Generating the Layout
  6. Painting

I imagine if you’re really getting into performance work, you’ll want a firm understanding of this. There are lots of ways to block/delay parts of this process. The job of a perf nerd is to understand when and why that’s happening, evaluate if it’s necessary or not, and tweak things to get to that painting step as soon as possible.

I’m curious if this is generic enough that 100% of all rendering engines work 100% the same way, or if there are significant differences.

Direct Link to ArticlePermalink


Understanding the Critical Rendering Path is a post from CSS-Tricks

Categories: Designing, Others Tags:
  1. No comments yet.
  1. No trackbacks yet.
You must be logged in to post a comment.