El critical rendering path (ruta crítica de renderizado) es la secuencia de pasos que el navegador ejecuta para convertir HTML, CSS y JS en píxeles en pantalla. Cualquier cosa que deba terminar antes del primer paint es render-blocking (bloqueante del renderizado).
<script> simple detiene el parseo del HTML mientras se descarga y ejecuta.<!-- 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>
Usa defer para el código de la app que toca el DOM, y async para scripts independientes como analytics. Incorpora el CSS crítico en línea y carga el resto sin bloquear.
Este es el modelo mental detrás de casi todas las correcciones de tiempo de carga: el CSS/JS render-blocking es la causa principal de un primer paint lento y un LCP deficiente. Saber por qué existen defer/async demuestra que entiendes el navegador, no solo la sintaxis.
Una biblioteca de preguntas de entrevista de IT con respuestas detalladas — de Junior a Senior.
Donar