Cargando CSS sin bloquear el renderizado | Programar Plus

Por lo general, desea que CSS bloquee la representación. Las páginas se cargarían de una manera muy incómoda si primero viera que la página se carga sin CSS, luego cambia a medida que se analiza el CSS y se aplica a la página.

Pero hay algunas situaciones en las que desea aplazar la carga de CSS, por ejemplo, una hoja de estilo de fuentes personalizadas que no le importa descargar tarde. O incluso su hoja de estilo principal si está haciendo CSS crítico.

Keith Clark presenta una forma realmente sencilla de hacer esto en este artículo (sin dependencias). Scott Jehl intervino diciendo onload aunque tiene un apoyo irregular. Su pequeño cargador de CSS asíncrono es probablemente la mejor manera de obtener la mejor compatibilidad posible con el navegador.

Otra forma de aplazar la carga de CSS es simplemente ponerlo al final del documento, como solemos hacer con los scripts. Pero tenga en cuenta que la ventaja de hacerlo mentalmente es que la descarga se activa de inmediato, por lo que, en última instancia, es un poco más rápida. Colocamos scripts en el pie de página porque no es solo la descarga del script lo que puede bloquear, sino también la ejecución (doble golpe). No estoy seguro de si CSS tiene bloqueando la ejecución (si se puede llamar así), pero no lo creo (?).

Enlace directo →

(Visited 3 times, 1 visits today)