The critical rendering path är sekvensen av steg som webbläsaren kör för att förvandla HTML, CSS och JS till pixlar på skärmen. Allt som måste bli klart innan den första målningen är render-blocking.
The critical rendering path är sekvensen av steg som webbläsaren kör för att förvandla HTML, CSS och JS till pixlar på skärmen. Allt som måste bli klart innan den första målningen är render-blocking.
<script> stoppar HTML-parsningen medan det laddas ner och körs.<!-- 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>
Använd defer för app-kod som rör DOM, och async för fristående skript som analytics. Inline:a kritisk CSS och ladda resten utan att blockera.
Detta är den mentala modellen bakom nästan varje laddningstidsåtgärd: render-blocking CSS/JS är den främsta orsaken till långsam första målning och dålig LCP. Att veta varför defer/async finns visar att du förstår webbläsaren, inte bara syntaxen.
Ett bibliotek med IT-intervjufrågor och detaljerade svar — från Junior till Senior.
Donera