Esta regla se activa cuando PageSpeed Insights detecta que se requieren recorridos de ida y vuelta de red adicionales para procesar el contenido de la mitad superior de la página.
Descripción general
Si la cantidad de datos requeridos supera el período de congestión inicial (por lo general, 14.6 KB comprimidos), se necesitarán idas y vueltas adicionales entre tu servidor y el navegador del usuario. En el caso de los usuarios de redes con latencia alta, como las redes móviles, esto puede generar demoras significativas en la carga de la página.
Recomendaciones
Para que las páginas se carguen más rápido, limita el tamaño de los datos (lenguaje de marcado HTML, imágenes, CSS, JavaScript) necesarios para procesar el contenido de la mitad superior de la página. Hay varias formas de hacerlo:- Estructura tu código HTML para cargar primero el contenido crítico de la mitad superior de la página
- Reduce la cantidad de datos que usan tus recursos
Estructura tu HTML para cargar primero el contenido crítico de la mitad superior de la página
Primero, carga el contenido principal de tu página. Estructura la página para que la respuesta inicial del servidor envíe los datos necesarios para renderizar de inmediato la parte crítica de la página y aplazar el resto. Esto puede implicar que debes dividir tu CSS en dos partes: una intercalada que se encarga de ajustar el estilo de la parte ATF del contenido y la parte que se puede aplazar.
Considera los siguientes ejemplos de cómo se puede reestructurar un sitio para que se cargue más rápido:
- Si tu código HTML carga widgets de terceros antes de cargar el contenido principal, cambia el orden para cargarlo primero.
- Si tu sitio usa un diseño de dos columnas con una barra lateral de navegación y un artículo, pero tu código HTML carga la barra lateral antes del artículo, considera cargar primero el artículo.
Reduce la cantidad de datos que usan tus recursos
Una vez que se haya rediseñado tu sitio para que funcione bien en varios dispositivos y cargue primero el contenido más importante, usa las siguientes técnicas para reducir la cantidad de datos necesarios para procesar tu página:- Minifica los recursos: Se pueden reducir los códigos HTML, CSS y JavaScript quitando los espacios en blanco y los comentarios innecesarios. Se pueden realizar más optimizaciones mediante el uso de herramientas que renombran los nombres de las variables en tus recursos.
- Considera usar CSS en lugar de imágenes siempre que sea posible.
- Habilitar la compresión
Comentarios
¿Te sirvió esta página?