Το critical rendering path είναι η ακολουθία των βημάτων που ακολουθεί το πρόγραμμα περιήγησης για να μετατρέψει HTML, CSS και JS σε pixels. Η κατανόησή του εξηγεί τι μπλοκάρει την απόδοση και πώς να κάνετε τις σελίδες να ζωγραφίζονται πιο γρήγορα.
Τα βήματα
1. Parse HTML → DOM tree (the document structure)
2. Parse CSS → CSSOM tree (the style rules)
3. DOM + CSSOM → Render tree (visible nodes + their styles)
4. Layout (reflow) → compute each node's geometry (position/size)
5. Paint → fill in pixels (colors, text, images)
6. Composite → combine layers onto the screen
