CSS crítico

Genera el CSS above-the-fold con un navegador real y sírvelo desde Managed CDN.

7 min read

Critical CSS es el subconjunto de CSS necesario para renderizar rápido el contenido above-the-fold. Cache Rocket lo genera en la nube mediante un análisis de cobertura con un navegador headless real, sube un archivo critical.css compacto a Managed CDN, y el plugin de WordPress lo inyecta para tus visitantes.

Requisito de plan

Critical CSS está disponible en Pro y Business, con una cuota mensual de páginas. Comprueba el derecho en Cuenta → Suscripción.

Actívalo

  1. 1

    Conecta tus claves API

    Pega las claves pública y secreta en la pantalla Account del plugin. Consulta Claves API.

  2. 2

    Comprueba tu plan

    Critical CSS debe estar incluido, con cuota mensual de páginas disponible.

  3. 3

    Activa «Generar Critical CSS»

    En Media, activa la generación de Critical CSS.

  4. 4

    Genera para las páginas que te importan

    Ejecuta la generación para las plantillas o URL clave, dentro de tu cuota mensual.

Derecho Unused CSS

Los planes superiores pueden mostrar un derecho Unused CSS. Ese indicador reserva la capacidad a nivel de facturación; la generación de Critical CSS es el flujo de CSS en la nube que realmente se entrega y se documenta aquí. No esperes un procesador de Unused CSS independiente a menos que aparezca como su propio control de Media.

Preguntas comunes

¿Por qué un navegador real?
La cobertura obtenida de una carga de página real refleja con precisión qué CSS se usa realmente por encima del pliegue para esa URL, y se mantiene fiable aunque cambien los temas.
¿De dónde cargan los visitantes critical.css?
Desde Managed CDN (assets.cacherocket.com), inyectado por el plugin.
¿Qué pasa al llegar a la cuota?
Los nuevos trabajos de Critical CSS se pausan hasta que se reinicie la cuota mensual o mejores de plan.