Critical rendering path je zaporedje korakov, ki jih brskalnik izvede, da HTML, CSS in JS spremeni v piksle na zaslonu. Vse, kar mora biti dokončano pred prvim izrisom, je render-blocking.
Critical rendering path je zaporedje korakov, ki jih brskalnik izvede, da HTML, CSS in JS spremeni v piksle na zaslonu. Vse, kar mora biti dokončano pred prvim izrisom, je render-blocking.
<script> ustavi razčlenjevanje HTML, medtem ko se prenaša in izvaja.<!-- Blocks parsing: browser waits here before continuing -->
<script src="/app.js"></script>
<!-- defer: download in parallel, run after HTML is parsed, in order -->
<script src="/app.js" defer></script>
<!-- async: download in parallel, run as soon as ready (order not guaranteed) -->
<script src="/analytics.js" async></script>
Uporabi defer za kodo aplikacije, ki se dotika DOM, in async za neodvisne skripte, kot je analitika. Vgradi kritični CSS in preostanek naloži brez blokiranja.
To je miselni model za skoraj vsak popravek časa nalaganja: render-blocking CSS/JS je glavni vzrok počasnega prvega izrisa in slabega LCP. Poznavanje, zakaj obstajata defer/async, pokaže, da razumeš brskalnik, ne le sintakse.
Knjižnica IT vprašanj za razgovore s podrobnimi odgovori — od začetnika do izkušenega.
Doniraj