Esta regla se activa cuando PageSpeed ????Insights detecta que una página web contiene una hoja de estilo externa que bloquea el procesamiento (que retrasa el tiempo que tarda el contenido en aparecer en la pantalla).
Si los recursos CSS externos son peque?os, puede insertarlos directamente en el documento HTML, lo que se denomina "inlining". Al incorporar recursos CSS más peque?os de esta manera, el navegador puede continuar representando la página web. Tenga en cuenta que la incorporación completa de CSS puede hacer que PageSpeed ????Insights pase si el archivo CSS es grande.Priorizar el contenido visibleLe advierte que la parte superior de su página es demasiado grande. Si el archivo CSS es grande, debe identificar e incrustar el CSS necesario para presentar el contenido de la mitad superior de la página y suspender la carga del resto de los estilos hasta que se muestre el contenido de la mitad superior de la página.
ypeque?o.css
Los recursos son los siguientes:
Luego puede insertar CSS crítico de la siguiente manera:
El peque?o.css original no se carga hasta que se carga la página. Pasar todoy
Los elementos se insertan en el documento para mantener el orden en el que se aplican las reglas CSS.
Tenga cuidado al incrustar URI de datos en archivos CSS. Puede optar por utilizar URI de datos más peque?os en CSS, porque incorporar URI de datos más grandes hará que el CSS de la mitad superior de la página se haga más grande, lo que retrasará el tiempo de representación de la página web.
Debería intentar evitar elementos HTML (por ejemplo,) propiedades CSS en línea, ya que esto a menudo conduce a la duplicación de código redundante. también,Política de seguridad de contenido(CSP) evita CSS en línea en elementos HTML de forma predeterminada.
?
Salvo que se indique lo contrario, el contenido de esta página tiene licencia bajo laLicencia Creative Commons Atribución 3.0y los ejemplos de código tienen licencia bajo laLicencia Apache 2.0Para más detalles, consulte nuestraPolíticas del sitio.