Performance
5 min read
The Critical Rendering Path
Gustavo J.
Feb 15, 2026
Why it matters
Performance isn't just about fast code; it's about how the browser processes it. The critical rendering path (CRP) is the sequence of steps the browser goes through to convert HTML, CSS, and JavaScript into pixels on the screen.
The Steps
1.DOM: Document Object Model
2.CSSOM: CSS Object Model
3.Render Tree: Combining DOM and CSSOM
4.Layout: Calculating geometry
5.Paint: Filling in pixels
Optimizing each of these stages is what makes a website feel "instant". In my projects, I prioritize reducing render-blocking resources to achieve a near-perfect Lighthouse score.
Enjoyed this article?
I share more insights about software engineering and performance on my LinkedIn and Twitter.
Get in touch