Actualizaciones de PageSpeed ​​Insights para Lighthouse 8.4


PageSpeed ​​Insights ahora usa Lighthouse 8.4.0, que presenta dos auditorías completamente nuevas. La adición más importante ayuda a los editores a diagnosticar un problema generalizado que impacta negativamente en la métrica de Pintura con contenido más grande. Esta nueva auditoría ayudará a los editores a lograr mejores puntuaciones de Pintura con contenido más grande (LCP).

Pintura con contenido más grande

Ha habido un problema desde hace mucho tiempo con Largest Contentful Paint (LCP) que la versión más reciente de Lighthouse, 8.4.0 ayudará a diagnosticar.

Se descubrió que la carga diferida de imágenes era un buen enfoque para hacer que la parte principal del contenido fuera visible e interactiva en un dispositivo móvil más rápido.

Antes de la carga diferida, las imágenes que estaban debajo del pliegue (no visibles en la ventana del navegador) se descargarían en segundo plano.

Anuncio publicitario

Continuar leyendo a continuación

Eso tuvo el efecto de ralentizar la visibilidad y la interactividad del contenido que estaba en la ventana gráfica del visitante del sitio.

Cuando las imágenes que están fuera de la ventana gráfica móvil se cargan en segundo plano, en realidad ralentizan la representación de la parte visible de la página web.

Al agregar el atributo Lazy Load HTML a las imágenes, el navegador sabría que no debe descargar las imágenes (que están fuera de la ventana gráfica) hasta más tarde.

Esto tiene el efecto de aumentar la velocidad de página.

Pero los elementos de carga diferida que se encuentran en la ventana de visualización de pintura con contenido más grande tienen un efecto negativo y esta es una de las cosas que aborda Lighthouse 8.4.0.

Anuncio publicitario

Continuar leyendo a continuación

Impacto negativo de la carga diferida de todas las imágenes

WordPress 5.4 introdujo la carga diferida nativa de imágenes. Antes de implementar el cambio, los desarrolladores probaron las mejoras de velocidad y descubrieron que agregar el atributo HTML de carga diferida a todas las imágenes daba como resultado una ganancia de velocidad.

Sin embargo, esa fue una implementación imperfecta del atributo de carga diferida porque WordPress ahora estaba agregando el atributo de carga diferida a la imagen destacada, que es un elemento que generalmente se encuentra en la ventana gráfica de un visitante del sitio cuando visita una página web.

Eso agregó un impacto negativo a la métrica Largest Contentful Paint (LCP) e introdujo una experiencia de usuario ligeramente negativa.

Las ganancias de agregar carga diferida superaron las pérdidas del golpe en la métrica LCP, por lo que WordPress procedió con esto.

Sin embargo, Google notó que después de la implementación de la carga diferida en el núcleo de WordPress, los puntajes de Lowest Contentful Paint (LCP) comenzaron a caer un poco.

En un artículo que Google publicado en Web.dev Sobre el efecto de rendimiento de demasiada carga diferida, investigaron los datos de sitios web reales y descubrieron que los sitios con demasiada carga diferida sufrían puntuaciones de LCP bajas.

Descubrieron que las implementaciones agresivas de carga diferida era la razón y se dieron cuenta de que se trataba de un problema específico de los sitios de WordPress.

Anuncio publicitario

Continuar leyendo a continuación

Google confirmó que los puntajes de WordPress para LCP estaban cayendo.

Los autores concluyeron:

«… la técnica de carga diferida utilizada por WordPress claramente ayuda a reducir los bytes de la imagen, pero a costa de un LCP retrasado».

Lighthouse 8.4.0 agrega auditoría de carga diferida de LCP

Es posible que los editores hayan visto caer sus puntajes de pintura con contenido más grande (LCP) y no entiendan por qué estaban empeorando. Lighthouse 8.4.0 resuelve este problema agregando una auditoría específicamente para diagnosticar este problema.

Todas las imágenes en la ventana de visualización de pintura con contenido más grande, la parte de la página web que un visitante ve primero, no deben cargarse de forma diferida.

Lighthouse 8.4.0 detectará si hay elementos en la ventana gráfica de LCP que se cargan de forma diferida.

Anuncio publicitario

Continuar leyendo a continuación

A Página de desarrollador de Chrome describe cómo funciona Lighthouse 8.4.0:

«Lighthouse ahora detectará si el elemento de pintura con contenido más grande (LCP) fue una imagen de carga diferida y recomendará eliminar el atributo de carga».

La página oficial para desarrolladores de Lighthouse 8.4.0 describe la nueva funcionalidad:

“Detecta cuando el elemento LCP tiene carga diferida. Las imágenes de la mitad superior de la página que se cargan de forma diferida se procesan más adelante en el ciclo de vida de la página, lo que puede retrasar la pintura con contenido más grande «.

Nueva auditoría de viewport móvil

Lighthouse 8.4.0 también agregará una nueva auditoría que detecta si no hay una metaetiqueta de ventana gráfica móvil en la sección principal.

Esto es importante porque no agregar esta metaetiqueta puede resultar en una puntuación de Retraso de la primera entrada más baja.

Anuncio publicitario

Continuar leyendo a continuación

La documentación explica la importancia de esta nueva auditoría:

“En un estudio reciente de datos del Archivo HTTP, más de la mitad de los sitios que recibieron una puntuación de 90 o más en Lighthouse, pero fallaron en al menos un Core Web Vital, no tenían una ventana gráfica configurada y estaban fallando FID. Como resultado, la sección de rendimiento de Lighthouse ahora recomendará agregar una ventana gráfica como la siguiente si no se encuentra ninguna:

<meta name="viewport" content="width=device-width">"

Lighthouse 8.4.0 está en vivo

Lighthouse 8.4.0 ahora está activo en PageSpeed ​​Insights y activará la nueva advertencia de LCP si encuentra un elemento cargado de forma diferida en la ventana de visualización de pintura con contenido más grande.

Anuncio publicitario

Continuar leyendo a continuación

Chrome Dev Tools contará con Lighthouse 8.4.0 en Chrome 95, cuyo lanzamiento está programado actualmente para el 19 de octubre de 2021.

Citas

Lea la página para desarrolladores de Chrome para Lighthouse 8.4.0

Novedades de Lighthouse 8.4

Los efectos en el rendimiento de una carga diferida excesiva

Página de GitHub de Lighthouse v8.4





Consultar el artículo en la publicación original

Actualizaciones de PageSpeed ​​Insights para Lighthouse 8.4
Salir de la versión móvil