Critical rendering path yra žingsnių seka, kurią naršyklė atlieka, kad HTML, CSS ir JS paverstų pikseliais ekrane. Bet kas, kas turi baigtis prieš pirmąjį paint, yra render-blocking.
Critical rendering path yra žingsnių seka, kurią naršyklė atlieka, kad HTML, CSS ir JS paverstų pikseliais ekrane. Bet kas, kas turi baigtis prieš pirmąjį paint, yra render-blocking.
<script> sustabdo HTML analizę, kol atsisiunčia ir vykdomas.<!-- 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>
Naudokite defer programos kodui, kuris liečia DOM, ir async nepriklausomiems skriptams, tokiems kaip analitika. Įterpkite kritinį CSS ir likusį įkelkite neblokuodami.
Tai yra mentalinis modelis už beveik kiekvieno įkėlimo laiko sprendimo: render-blocking CSS/JS yra pagrindinė lėto pirmojo paint ir prasto LCP priežastis. Žinojimas, kodėl egzistuoja defer/async, parodo, kad suprantate naršyklę, o ne vien sintaksę.
IT pokalbių klausimų biblioteka su išsamiais atsakymais — nuo Junior iki Senior.
Paaukoti