Materi
Jalur render kritis adalah langkah-langkah peramban sebelum gambar pertama halaman tampil: membangun DOM dari HTML, CSSOM dari CSS, menjalankan JavaScript yang mengubah keduanya, lalu tata letak dan pengecatan. web.dev menyebut CSS penghambat render secara bawaan: setelah menemukan link rel="stylesheet" atau elemen style, peramban tidak merender konten berikutnya sampai CSS itu selesai diunduh dan diproses. Deklarasi @import di dalam CSS lebih buruk lagi, karena berkas yang diimpor baru ditemukan setelah berkas induknya tiba; dua link di HTML diunduh bersamaan, dua @import diunduh berurutan.
Elemen script tanpa atribut menghambat parser. HTML Standard menulis: script klasik eksternal tanpa async dan defer diambil dan dijalankan saat itu juga, dan parsing berhenti sampai keduanya selesai. Dengan async, script diambil sejajar dengan parsing dan dijalankan begitu tersedia, sehingga urutan antar-script tidak dijamin. Dengan defer, script diambil sejajar dan dijalankan setelah parsing selesai, berurutan sesuai letaknya di dokumen. Script type="module" otomatis berperilaku seperti defer, dan atribut defer tidak berpengaruh padanya. Untuk script inline klasik, async dan defer tidak berpengaruh.
<link rel="stylesheet" href="/css/dasar.css">
<script src="/js/pustaka.js" defer></script>
<script src="/js/aplikasi.js" defer></script> <!-- butuh pustaka.js -->
<script src="https://ukur.example/tag.js" async></script> <!-- berdiri sendiri -->
