Nuevas métricas de rendimiento, actualizaciones de PageSpeed Insights y el Informe sobre la experiencia del usuario en Chrome (CrUX), y mucho más.
En Chrome Developer Summit, Paul Irish y yo anunciamos actualizaciones de Lighthouse, como Lighthouse CI, una nueva fórmula de puntuación de rendimiento y mucho más. Junto con las grandes noticias de Lighthouse, presentamos emocionantes desarrollos de herramientas de rendimiento, incluidas nuevas métricas de rendimiento, actualizaciones de PageSpeed Insights y el informe sobre la experiencia del usuario en Chrome (CrUX), y estadísticas del análisis del ecosistema web del Almanaque web.
Nuevas métricas de rendimiento
Medir los matices de la experiencia de un usuario es clave para cuantificar el impacto que tiene en tus resultados y hacer un seguimiento de las mejoras y las regresiones. Con el tiempo, las métricas nuevas evolucionaron para capturar esos matices y cerrar los vacíos a la hora de medir la experiencia del usuario. La incorporación más reciente a la historia de las métricas son dos métricas de campo: Largest Contentful Paint (LCP) y Cumulative Layout Shift (CLS), que se están incubando en el grupo de trabajo de rendimiento web del W3C, y una nueva métrica de lab: Total Blocking Time (TBT).
Largest Contentful Paint (LCP)
Largest Contentful Paint (LCP) informa el momento en que el elemento de contenido más grande se vuelve visible en el viewport.
Antes del procesamiento de imagen con contenido más grande, la primera pintura significativa (FMP) y el Índice de velocidad (SI) sirvieron para capturar la experiencia de carga después de la pintura inicial. Sin embargo, estas métricas son complejas y, a menudo, no identifican cuándo se carga el contenido principal de la página. Las investigaciones demostraron que observar cuándo se renderiza el elemento más grande de la página representa mejor cuándo se carga el contenido principal de una página.
La nueva métrica Largest Contentful Paint pronto estará disponible en los informes de Lighthouse. Mientras tanto, puedes medir el LCP en JavaScript.
Tiempo de bloqueo total (TBT)
La métrica Total Blocking Time (TBT) mide la cantidad total de tiempo entre el First Contentful Paint (FCP) y el Time to Interactive (TTI) durante el cual el subproceso principal se bloqueó durante el tiempo suficiente para evitar la respuesta de la entrada.
Una tarea se considera larga si se ejecuta en el subproceso principal durante más de 50 milisegundos. Cualquier milisegundo adicional se cuenta para el tiempo de bloqueo de esa tarea.
El tiempo de bloqueo total de una página es la suma de los tiempos de bloqueo de todas las tareas largas que ocurrieron entre el FCP y el TTI.
Si bien el tiempo de respuesta interactivo hace un buen trabajo para identificar cuándo se calma el subproceso principal más adelante en la carga, el tiempo de bloqueo total tiene como objetivo cuantificar qué tan forzado está el subproceso principal durante la carga. De esta manera, el TTI y el TBT se complementan y proporcionan un equilibrio.
Cumulative Layout Shift (CLS)
El Cambio de diseño acumulado (CLS) mide la estabilidad visual de una página y cuantifica la frecuencia con la que los usuarios experimentan cambios de diseño inesperados. El movimiento inesperado de contenido puede ser muy frustrante, y esta métrica nueva te ayuda a resolver ese problema, ya que mide la frecuencia con la que ocurre para tus usuarios.
Consulta la guía detallada del cambio de diseño acumulado para obtener información sobre cómo se calcula y cómo se mide.
La nueva fórmula de la puntuación de rendimiento de Lighthouse pronto dejará de enfatizar la FMP y la FCI, y también incluirá las tres métricas nuevas: LCP, TBT y CLS, ya que captan mejor cuándo una página se siente utilizable.
Consulta Puntuación de rendimiento de Lighthouse y la nueva colección de métricas web.dev para obtener más información.
Umbrales de datos de campo (CrUX) ajustados en PageSpeed Insights
Durante el último año, analizamos el rendimiento web en el campo a través de los datos del Informe sobre la experiencia del usuario en Chrome (CrUX). Con las estadísticas de esos datos, volvimos a evaluar los umbrales que usamos para etiquetar un sitio web como "lento", "moderado" o "rápido" en el rendimiento en el campo.
A fin de obtener una evaluación general de un sitio, PageSpeed Insights (PSI) usa un percentil determinado de la distribución total de los datos de campo como el número dorado de ese sitio. Los umbrales anteriores usados eran el percentil 90 para el primer procesamiento de imagen con contenido y el percentil 95 para el retraso de primera entrada (FID).
Por ejemplo, si un sitio tiene una distribución de FCP de un 50% rápido, un 30% moderado y un 20% lento, el FCP del percentil 90 se encuentra en la sección lenta, lo que hace que la puntuación general de campo para el sitio sea lenta.
Se ajustó para tener una mejor distribución general en los sitios web y el nuevo desglose es el siguiente:
Métrica | Percentil general | Rápido (ms) | Moderada (ms) | Lento (ms) |
FCP | Percentil 75 | 1000 | 1000-3000 | 3,000 o más |
FID | Percentil 95 | 100 | 100-300 | Más de 300 |
Por ejemplo, ahora, si un sitio tiene una distribución de FCP de 50% rápido, 30% moderado y 20% lento, el FCP del percentil 75 está en la sección moderada, lo que hace que la puntuación general del campo del sitio sea moderada.
Redireccionamientos de URL canónicas en PageSpeed Insights
Para que puedas medir la experiencia del usuario de la forma más precisa posible, el equipo de PageSpeed Insights agregó un mensaje para volver a analizar a PSI. En el caso de los sitios que se redireccionan a una URL nueva, se te solicita que vuelvas a ejecutar el informe en la URL de destino para obtener un panorama más completo de tu rendimiento real.
CrUX en el nuevo informe de velocidad de Search Console
Search Console lanzó su nuevo informe de velocidad una semana antes de la Chrome Dev Summit. Usa datos del Informe sobre la experiencia del usuario en Chrome para ayudar a los propietarios de los sitios a descubrir posibles problemas con la experiencia del usuario. El Informe de velocidad asigna automáticamente grupos de URLs similares a los buckets "Rápido", "Moderado" y "Lenta", y ayuda a priorizar las mejoras de rendimiento para problemas específicos.
Almanaque web
En el discurso de apertura, anunciamos el lanzamiento de Web Almanac, un proyecto anual que combina las estadísticas y tendencias sobre el estado de la Web con la experiencia de la comunidad web. 85 colaboradores, que incluyen desarrolladores de Chrome y la comunidad web, se ofrecieron como voluntarios para trabajar en el proyecto, que analiza 20 aspectos principales sobre la Web y aborda cómo se compilan, entregan y experimentan los sitios. Comienza a explorar el Almanaque web para obtener más información sobre el estado del rendimiento, JavaScript y el código de terceros en la Web.
Más información
Para obtener más detalles sobre las actualizaciones de las herramientas de rendimiento de la Cumbre de desarrolladores de Chrome, mira la charla sobre la evolución de las herramientas de velocidad: