Kas ir kritiskais ceļš tīmekļa lapu renderēšanai?

Tas ir secība soļu, ko pārlūkprogramma veic, lai ekrānā parādītu lapas saturu, sākot ar HTML dokumenta saņemšanu. Tas ietver:

1. DOM (Dokumenta objekta modeļa) izveidi: HTML koda analīzi un objekta koka izveidi, kas pārstāv dokumenta struktūru.
2. CSSOM (CSS objekta modeļa) izveidi: CSS failu un inline stilu analīzi, lai izveidotu objektu koku, kas pārstāv elementu stilus.
3. Render koka izveidi: DOM un CSSOM apvienošana. Tiek izveidots koks tikai ar renderējamiem elementiem ar piemērotajiem stiliem.
4. Layout (vai Reflow): Katras elementa ģeometrisko izmēru un pozīcijas noteikšana lapā.
5. Paint (vai Repaint): Pikseļu aizpildīšana ekrānā, balstoties uz render koku un layout datiem.

Kritiskā renderēšanas ceļa optimizācija ir vērsta uz to, lai pārlūks pēc iespējas ātrāk parādītu pirmo nozīmīgo saturu (First Meaningful Paint) vai interaktivitāti (Time to Interactive). To panāk, minimizējot bloķējošos resursus (JS un CSS), optimizējot resursu izmērus un to ielādi atbilstošajā brīdī.