Esta es una de esas publicaciones que trata de entender detalles sobre la optimizaciones del CSS en WordPress.
En los plugins de caché y otros vas a encontrar varias optimizaciones de CSS disponibles.
Esta publicación trata sobre la opción de incrustar el CSS dentro del código HTML, algo que se le conoce también como CSS en línea o Inline CSS y la opción para crear una hoja de CSS externa.
Table of Contents
CSS en Linea vs CSS Externo en GeneratePress
Lo que me ha hecho investigar sobre este tema son una de las opciones disponibles dentro de GeneratePress.
Donde encuentras una opción llamada Inline Embedding y un mensaje que dice que generar CSS dinámico en un archivo externo ofrece ventajas de desempeño significativas.
Lo cual es bastante intrigante y lo que nos lleva a pensar el porqué está disponible la opción de inline embedding si esta no es la mejor opción en términos de desempeño
CSS en Linea vs CSS Externo en GenerateBlocks
Si examinas las opciones presentes en GenerateBlocks vas a encontrar que tienes la opción de generar el CSS en un hoja externa o hacer el inline embedding
En este también encontrarás la recomendación que indica que “generar una hoja de estilos externa es mejor para el desempeño de tu sitio.
Con esto ya tienes dos razones para estar confundido.
Viaje a GTMetrix
Una de las mejores herramientas para entender las solicitudes de tu sitio es GTMetrix, especialmente su cascada.
La cascada de la GTMetrix me dice que lo primero que carga es el HTML del sitio con el CSS incrustado.
Luego cargan 3 hojas de estilo y un archivo de JavaScript.
Por lo que podemos deducir que las opciones que se están incrustando en el HTML son las opciones del tema y del plugin de bloques de Gutenberg y no todo el CSS del sitio.
Hice la prueba generando hojas externas tanto en GeneratePress y GeneratePress y estos han sido los resultados.
Debido a la alta optimización del sitio, los resultados son casi difíciles de superar, las mejoras son ligeras.
Lo otro que debo reconocer es que el uso de dos hojas externas adicionales no han deteriorado los resultados obtenidos usando el inline embedding presente en GeneratePress y GenerateBlocks
Conclusiones
Al final del día en este tema de la optimización web debes hacer lo que mantenga o mejore la experiencia del usuario.
Si la experiencia del usuario se puede mantener o mejorar con las optimizaciones, usa los datos en los tests de velocidad para tomar la mejor decisión.
Publicaciones Relacionadas
Estas son algunas publicaciones relacionadas con temas de optimización web
