En las ultimas publicaciones, he estado conversando sobre la optimizacíon de codigo HTML, CSS y JS.
Una de esas opciones es la implementacíon del Critical CSS o CSS critíco.
El CSS crítico es el proceso de tomar el CSS mínimo que necesita para mostrar la primera parte de una página web y luego aplicarlo en línea para que se cargue más rápido.
La implementación del critical CSS se puede realizar por medio de plugins. WP Rocket es una
Table of Contents
CSS Critíco: Lo Ideal
Gijo Varghese indica que la implementacíon de CSS crítico no tiene nada que ver con el tiempo de carga de la pagina.
El proposito de el CSS Critíco es que el usuario de tu sitio pueda ver la mayor parte del contenido lo más rapido posible.
En el mundo perfecto, asi debe lucir la carga de un sitio segun Google Page Insights
Los 10 pequeños screenshots de Google Page Insights revela que el usuario podrá leer el contenido de mi sitio una vez que se encuentre en este.
Este es un ejemplo de como no deseas que luzca tu resultado de Google Page Insights, el sitio usado es OwnTheYard.
Debería Usar Critical CSS
WP Johnny, un experto en el tema de la optimización de WordPress cuestiona que no todos deben usar CSS critíco.
Johnny indica que el CSS critico debe ser implementado por aquellos sitios cuyas pagínas cuyo CSS supera los 60 KB
Revisé una de mis publicaciones y ví que el CSS de esa publicación es 14 KB
Por lo que según WPJohnny, no deberia preocuparme por tratar de implementar el CSS Critíco.
Johnny tambien indica que si tienes mucho CSS, deberias encargarte de ese problema
Conclusión
La implementació del CSS critíco puede ser una buena, podria mejorar la experiencia del usuario o simplemente no aportar nada a tus esfuerzos.
Si una optimización no mejora las cosas, se convierte en un proceso más que agota recursos de tu servidor.
Lo que debes hacer es realizar pruebas del antes y despues de la implementación con la esperanza que eso mejore las cosas.
Ya tienes una idea sobre a lo que debes prestarle atencíon
Fuentes
Estas fueron las fuentes usadas para la creación de esta publicación
Información Relacionada
Estas son algunas publicaciones sobre el mejoramiento de la velocidad en WordPress
- Optimizar el Código CSS, JS y HTML en WordPress.
- Breeze: Plugin de Cache de Cloudways
- Remover CSS y JS Innecesario de WordPress
- Crear un Favicon en Blanco en WordPress
- Code Snippets para WordPress: Los 18 Mejores
- Cómo Acelerar tu Sitio de WordPress: El Dilema
- Full Page Caching de CloudFlare
- Cómo Usar la Cascada de GTMetrix
- Reseña sobre CloudFlare APO: ¿Debería Usarlo?
- Mejorar Resultados de Core Web Vitals
