Combine las herramientas de Google para auditar, mejorar y supervisar su sitio web de manera eficaz.
Fecha de publicación: 28 de mayo de 2020
Las Métricas web esenciales son un conjunto de métricas que evalúan la experiencia del usuario en función de criterios como el rendimiento de carga, la capacidad de respuesta a las entradas del usuario y la estabilidad del diseño.
En esta guía, se explorará un flujo de trabajo para mejorar las Métricas web esenciales de tu sitio web, pero el lugar en el que comienza ese flujo de trabajo depende de si recopilas tus propios datos de campo. El final puede depender de qué herramienta de Google consideres útil para diagnosticar y solucionar problemas de experiencia del usuario.
Las Métricas web esenciales se miden mejor en el campo
Las Métricas web esenciales están diseñadas específicamente para medir la experiencia de los usuarios en tu sitio web; son métricas centradas en el usuario. Las herramientas basadas en laboratorios, como Lighthouse, son herramientas de diagnóstico para destacar posibles problemas de rendimiento y prácticas recomendadas. Las herramientas basadas en labs se ejecutan en ciertas condiciones predefinidas y es posible que no reflejen las mediciones de las Métricas web esenciales de la vida real que experimentan tus usuarios.
Por ejemplo, Lighthouse es una herramienta basada en labs que ejecuta pruebas con limitación simulada en un entorno simulado de escritorio o móvil. Si bien estas simulaciones de condiciones de red y dispositivo más lentas son útiles cuando se intenta diagnosticar problemas de rendimiento, son solo una pequeña parte de la gran variedad de condiciones de red y capacidades de los dispositivos, por lo que es posible que no reflejen lo que experimentan los usuarios en tus sitios.
Por lo general, las herramientas basadas en laboratorios, como Lighthouse, también realizan una "carga en frío" de una página web como un visitante totalmente nuevo. A menudo, esta es la carga más lenta, pero en la vida real, es posible que los visitantes tengan algunos recursos almacenados en caché si ya visitaron el sitio o cuando navegan por él. Es posible que los visitantes y las herramientas nuevos experimenten el sitio de manera diferente con los banners de cookies o con otro contenido que se les presente.
En resumen, si bien las herramientas basadas en laboratorios pueden indicar posibles problemas de rendimiento y ayudarte a depurar y iterar, es posible que no representen cuántos de tus visitantes realmente experimentan tu sitio web. Usa datos de campo para medir el rendimiento en el mundo real y herramientas basadas en laboratorios, como Lighthouse, para diagnosticar cómo mejorarlo. Consulta también la sección Cuándo usar Lighthouse.
Google mide las Métricas web esenciales mediante el Informe sobre la experiencia del usuario en Chrome (CrUX). Este es un conjunto de datos públicos recopilado de usuarios reales de Chrome. Es la columna vertebral de muchas herramientas de Google y de terceros que informan las Métricas web esenciales de un sitio.
Sin embargo, CrUX tiene sus limitaciones. A menudo, puede decirte cuándo hay un problema, pero no tiene datos suficientes para decirte por qué.
Recopila tus propios datos de campo si es posible
El mejor conjunto de datos para mejorar el rendimiento del sitio web en el campo es el que tú creas. Para ello, debes recopilar datos de campo de los visitantes de tu sitio web. La forma de hacerlo depende del tamaño de tu organización y de si quieres pagar por una solución de terceros o crear tu propia solución.
Es casi seguro que las soluciones pagadas midan las métricas web esenciales (y otras métricas de rendimiento) y, por lo general, proporcionan una variedad de herramientas para analizar los datos resultantes. En organizaciones grandes con recursos significativos, este puede ser el método preferido.
Sin embargo, es posible que no formes parte de una organización grande o que no tengas los medios para pagar una solución de terceros. En estos casos, la biblioteca web-vitals de Google te ayudará a recopilar todos los KPIs de Web Vitals. Sin embargo, serás responsable de cómo se informen, almacenen y analicen esos datos.
Si ya usas Google Analytics, pero aún no comenzaste a recopilar tus propios datos de campo, es posible que puedas usar la biblioteca web-vitals para enviar Métricas web recopiladas en el campo a Google Analytics y usar las exportaciones de GA4 de BigQuery para generar informes sobre los datos.
Comprende las herramientas de Google
Independientemente de si recopilas tus propios datos de campo, existen varias herramientas de Google que pueden ser útiles para analizar las Métricas web esenciales. Antes de establecer un flujo de trabajo, una descripción general de cada herramienta puede ayudarte a comprender qué herramientas pueden ser las más adecuadas para ti.
Informe sobre la experiencia del usuario en Chrome (CrUX)
Como se mencionó anteriormente, CrUX es un conjunto de datos públicos de datos de campo recopilados de un segmento de usuarios reales de Google Chrome de millones de sitios web. Incluye Métricas web esenciales y otras métricas para sitios web con suficiente tráfico.
CrUX está disponible como un conjunto de datos de BigQuery mensual a nivel de origen o como una API diaria a nivel de URL o de origen, siempre y cuando el origen o la URL tengan suficientes muestras en el conjunto de datos CrUX. Los datos de BigQuery también se pueden ver en el panel de CrUX, lo que permite a los sitios revisar las tendencias históricas de su sitio.
Cuándo usar CrUX
Incluso si recopilas tus propios datos de campo, CrUX sigue siendo útil. Si bien CrUX representa un subconjunto de usuarios de Chrome, es útil comparar los datos de campo de tu sitio web para ver cómo se alinean con los datos de CrUX. Cada uno tiene ventajas y desventajas, que pueden generar diferencias. Si no recopilas ningún dato de campo para tu sitio web, CrUX es especialmente valioso para proporcionar una descripción general de alto nivel, siempre y cuando tu sitio web esté representado en su conjunto de datos.
Puedes usar CrUX directamente o con otra herramienta (incluidas las que se mencionan a continuación). Usar el conjunto de datos de CrUX directamente, ya sea con BigQuery o la API, es útil para exponer datos que no se muestran en otras herramientas (por ejemplo, los datos a nivel del país suelen no estar disponibles en otras herramientas) o para ver las métricas adicionales en CrUX, que, a su vez, suelen no aparecer en otras herramientas.
Cuándo no usar CrUX
CrUX solo representa a los usuarios de Chrome y, aun así, solo a un subconjunto de ellos. Una solución de RUM completa puede incluir más experiencias en Chrome y otros navegadores que admitan las métricas de Web Vitals.
Los sitios web que no reciben suficiente tráfico no se representan en el conjunto de datos de CrUX. Si este es tu caso, deberás recopilar tus propios datos de campo para comprender el rendimiento de tu sitio web en el campo, ya que CrUX no será una opción. Como alternativa, deberás depender de los datos de lab, pero con las limitaciones de que es posible que no sean representativos, como se describió anteriormente.
Dado que los datos que proporciona CrUX son un promedio móvil de los últimos 28 días, no es una herramienta ideal durante el desarrollo, ya que las mejoras tardarán bastante en reflejarse en el conjunto de datos de CrUX.
Por último, como conjunto de datos públicos, CrUX se limita a la cantidad de información que puede poner a disposición y cómo se pueden consultar estos datos. Capturar tus propios datos de RUM te permite recopilar más detalles (por ejemplo, el elemento LCP) y segmentar los datos para identificar problemas. ¿Los usuarios que acceden tienen mejores o peores Métricas web esenciales que los que no acceden? ¿Los usuarios con un LCP lento tienen un elemento LCP en particular? ¿Qué interacciones están causando valores altos de FID y INP?
PageSpeed Insights (PSI)
PSI es una herramienta que informa datos de campo de CrUX y del laboratorio de Lighthouse para una página determinada. Consulta esas secciones individuales para obtener más detalles.
Cuándo usar PSI
PSI es excelente para evaluar el rendimiento de CrUX a nivel de la página o del origen, tanto para los usuarios de dispositivos móviles como para los de computadoras de escritorio. Es una buena opción para obtener una descripción general inicial de las métricas web esenciales de una página o un sitio. También te permite ver datos de Métricas web esenciales de otros sitios, como la competencia.
PSI también proporciona datos de Lighthouse, que ofrecen recomendaciones útiles para mejorar tus Métricas web esenciales, si las métricas se alinean. Cuando no se alinean, es posible que las recomendaciones de Lighthouse sean menos relevantes.
Dado que Lighthouse se ejecuta desde el servidor, puede formar un modelo de referencia más coherente que ejecutar Lighthouse desde DevTools.
Cuándo no usar PSI
PSI solo está disponible para URLs públicas. No puede usarse en sitios de desarrollo que no sean de acceso público.
Los datos de CrUX solo están disponibles cuando los sitios cumplen con ciertos criterios de elegibilidad, incluidos los umbrales de popularidad del sitio. PSI es menos útil cuando los datos de CrUX no están disponibles para una página o un origen, ya que solo puede mostrar los datos de laboratorio de Lighthouse en estos casos.
Del mismo modo, si solo tienes datos de CrUX a nivel del origen en lugar de la URL específica que se está probando, esto también limita la utilidad de correlacionar los datos de campo a nivel del origen con los diagnósticos de laboratorio a nivel de la página. Tener los datos del campo a nivel de origen sigue siendo información muy útil como resumen del rendimiento del sitio, y las auditorías de Lighthouse pueden ayudar, pero se debe tener mucho cuidado en este caso.
Por último, cuando los datos a nivel de la página están disponibles en CrUX, pero difieren de los datos del lab de Lighthouse, las recomendaciones de Lighthouse pueden tener un valor limitado. Esto puede suceder, en particular, para los problemas de CLS después de la carga y para las Métricas web esenciales de interactividad (FID y INP), en las que las auditorías basadas en laboratorios son menos útiles.
Search Console
Search Console mide el rendimiento y el tráfico de la Búsqueda de tu sitio, incluidas las Métricas web esenciales. Solo está disponible para los propietarios de sitios que confirmaron su propiedad.
Una función valiosa de Search Console es que agrupa páginas similares (por ejemplo, páginas que usan la misma plantilla) en una sola evaluación de grupo. Search Console también incluye un informe de Métricas web esenciales basado en datos de campo de CrUX.
Cuándo usar Search Console
Search Console es adecuada tanto para desarrolladores como para personas que no desempeñan ese rol, ya que permite evaluar el rendimiento de la búsqueda y de las páginas de formas que no ofrecen otras herramientas de Google. Su presentación de datos de CrUX y el agrupamiento de páginas por similitud ofrecen estadísticas novedosas sobre cómo las mejoras de rendimiento afectan a categorías completas de páginas.
Cuándo no usar Search Console
Es posible que Search Console no sea adecuado para proyectos que usan diferentes herramientas de terceros que agrupan páginas por similitud o si un sitio web no está representado en el conjunto de datos de CrUX.
La agrupación de páginas también puede ser algo confusa cuando las páginas de ejemplo de un grupo tienen características diferentes a las del resto del grupo; por ejemplo, si el grupo falla en determinadas Métricas web esenciales en general, pero todas las páginas de ejemplo parecen aprobar las mismas Métricas web esenciales. Esto puede ocurrir cuando un grupo contiene una cola larga o páginas que rara vez se visitan y que pueden tardar más en cargarse, ya que es menos probable que se almacenen en caché. Cuando hay volúmenes suficientes de estas páginas en la cola larga, pueden influir en el porcentaje general de aprobación del grupo.
Faro
Lighthouse es una herramienta de lab que proporciona oportunidades específicas para mejorar el rendimiento de las páginas. Los flujos de usuarios de Lighthouse también permiten a los desarrolladores escribir secuencias de comandos de flujos de interacción para realizar pruebas de rendimiento más allá de la carga de la página.
Lighthouse-CI es una herramienta relacionada que ejecuta Lighthouse durante las compilaciones y las implementaciones de proyectos para ayudar con las pruebas de regresión de rendimiento. Presenta un informe de Lighthouse junto con las solicitudes de extracción y hace un seguimiento de las métricas de rendimiento a lo largo del tiempo.
Cuándo usar Lighthouse
Lighthouse es excelente para encontrar oportunidades para mejorar el rendimiento durante el desarrollo en entornos locales y de etapa de pruebas. La CI de Lighthouse es igualmente útil en las fases de compilación y, luego, de implementación en los entornos de etapa de pruebas y producción, donde se necesitan pruebas de regresión de rendimiento para preservar las buenas experiencias del usuario.
Cuándo no usar Lighthouse
Lighthouse (o Lighthouse CI) no reemplaza los datos de campo. Lighthouse es principalmente una herramienta de diagnóstico que enumera los posibles problemas y las prácticas recomendadas a partir de una carga de página predefinida. Es posible que las recomendaciones que muestra no siempre coincidan con el rendimiento que experimentan tus usuarios.
Si bien Lighthouse se puede usar para diagnosticar sitios de producción a través de herramientas como PageSpeed Insights, lo ideal es que se use en entornos de desarrollo y de integración continua para abordar los problemas de rendimiento antes de que lleguen a producción.
El panel Rendimiento en las herramientas para desarrolladores de Chrome
Chrome DevTools es un conjunto de herramientas de desarrollo en el navegador, incluido el panel Rendimiento. El panel Rendimiento es una herramienta de lab que consta de dos "modos":
Cuando se abre el panel Rendimiento por primera vez, la pantalla Métricas en tiempo real proporciona la métrica actual de Métricas web esenciales, con la capacidad de importar datos de campo de CrUX. Es útil como vista "en vivo" del rendimiento a medida que interactúas con la página para intentar descubrir problemas de rendimiento, en particular, los problemas posteriores a la carga que podrías ver con las métricas CLS y INP.
En segundo lugar, el panel Rendimiento permite a los desarrolladores capturar un perfil (o registro) de toda la actividad de la página durante la carga de la página o un período registrado. Esta vista ofrece estadísticas detalladas sobre todo lo que observa en dimensiones como la red, la renderización, la pintura y la actividad de secuencias de comandos, así como los métricas principales de la Web de una página.
Cuándo usar el Panel de rendimiento
Los desarrolladores deben usar el panel Rendimiento para obtener estadísticas detalladas sobre el rendimiento de una página en particular.
La vista de métricas en vivo se puede usar para comprender rápidamente las características de rendimiento actuales de la página y también para detectar posibles problemas cuando se interactúa con la página.
La vista de seguimiento es especialmente útil para depurar problemas de capacidad de respuesta que afectan a la INP. Una vez que se identifica y se puede repetir una interacción que responde de forma deficiente, el panel Rendimiento puede proporcionar una gran cantidad de datos sobre lo que sucede en el navegador para ayudar a comprender el problema, desde el bloqueo del subproceso principal hasta las pilas de llamadas de JavaScript y el trabajo de renderización.
Cuándo no usar el panel Rendimiento
El panel Rendimiento es una herramienta para desarrolladores que proporciona principalmente datos de lab, aunque con algo de contexto proveniente de CrUX. No reemplaza los datos de campo.
La vista de seguimiento contiene mucha información de depuración, pero debido a eso, puede ser difícil de entender para los desarrolladores principiantes o quienes no usan roles de desarrollador. Sin embargo, la vista de métricas en vivo con la que se abre el panel aborda esto ya que proporciona una interfaz más fácil de usar para quienes no requieren todos los detalles.
Flujo de trabajo de tres pasos para garantizar que las Métricas web esenciales de tu sitio web se mantengan en buen estado
Cuando se trabaja para mejorar la experiencia del usuario, lo mejor es pensar en el proceso como un ciclo continuo. Para mejorar las Métricas web esenciales y otras métricas de rendimiento, un enfoque podría ser el siguiente:
- Evalúa el estado del sitio web y, luego, identifica los problemas.
- Depurar y optimizar.
- Supervisa con herramientas de integración continua para detectar y evitar regresiones.
Paso 1: Evalúa el estado del sitio web y identifica oportunidades de mejora
Lo mejor es comenzar con datos de campo para evaluar el estado del sitio web.
- Usa PageSpeed Insights para ver las métricas generales de la experiencia en las Métricas web esenciales sobre el origen y la información específica de una URL individual.
- Search Console puede ser útil para identificar páginas que necesitan mejoras en caso de que su función de agrupación de páginas sea útil para tu sitio.
- Si tienes datos de RUM, entonces esa suele ser la mejor opción para poder identificar páginas o segmentos de tráfico específicos con problemas.
Ya sea que analices datos de campo que recopilas tú mismo o datos de CrUX, este primer paso es vital. Si no estás recopilando datos de campo, los datos de CrUX pueden ser suficientes para guiarte, siempre y cuando tu sitio web esté representado en el conjunto de datos.
Cómo analizar el rendimiento del sitio con PageSpeed Insights
PageSpeed Insights muestra los datos de CrUX que abarcan los últimos 28 días de datos de experiencia del usuario en el percentil 75. Esto significa que, si el 75% de las experiencias de los usuarios cumple con el umbral establecido para una métrica determinada, la experiencia se considera "buena".
Si tienes en mente una página específica para analizar el rendimiento, úsala. Para obtener una vista general de un sitio cuando comienzas a optimizarlo, te recomendamos que empieces por la página principal, ya que suele ser una de las páginas más populares en muchos sitios.
En un principio, concéntrate en la sección lo que experimentan tus usuarios reales de PSI. Verás hasta cuatro vistas de los datos: dispositivos móviles y computadoras para la URL ingresada y todo el origen. Compáralos y observa sus diferencias. Por lo general, los dispositivos móviles tienen un rendimiento menor que las computadoras de escritorio, ya que son dispositivos con más limitaciones de recursos que funcionan en condiciones de red potencialmente menos estables. Si la URL y los datos de origen son muy diferentes, intenta comprender por qué: las páginas principales suelen ser las primeras que se visitan (es decir, una página de destino), por lo que pueden ser más lentas que los usuarios de origen que reciben la peor parte de una caché del navegador no preparada. Es probable que las páginas posteriores se carguen más rápido, ya que los recursos compartidos se almacenarán en caché, lo que reducirá los datos agregados a nivel del origen.
PSI también muestra las tres Métricas web esenciales (LCP, CLS e INP), además de las métricas de diagnóstico TTFB y FCP. ¿Alguna de las Métricas web esenciales falla? ¿En cuánto? Esto te indicará dónde debes concentrar tus esfuerzos.
Comprende las relaciones entre estos números, en particular para el LCP. Si el LCP es lento, como en este ejemplo, observa el TTFB y el FCP, que son hitos para esa métrica. En este ejemplo, tenemos un TTFB de 1.8 segundos, lo que dificultará mucho cumplir con el umbral recomendado de 2.5 segundos para obtener un buen LCP. Esto sugiere un backend lento (problemas del servidor o falta de CDN), redes más lentas o redireccionamientos que retrasan los primeros bytes HTML. Consulta la guía para optimizar el TTFB para obtener más información. Además, el FCP tarda otro segundo, lo que puede indicar que las redes son más lentas. En este ejemplo, el LCP no se produce mucho tiempo después del FCP, lo que sugiere que el recurso de LCP está bien optimizado una vez que se carga la página.
En el caso de la CLS, observa las puntuaciones de la CLS de CrUX y de Lighthouse para ver si se trata de un problema de carga de la CLS (que Lighthouse detectará y sobre el que te dará recomendaciones) o un problema de CLS posterior a la carga que Lighthouse no detectará. Para obtener más información, consulta la guía para optimizar el CLS.
Para la capacidad de respuesta, consulta las puntuaciones de INP. Observa las auditorías TBT en Lighthouse para ver si se está procesando mucho procesamiento de JavaScript durante la carga inicial de la página, lo cual probablemente afecte a INP. El INP puede ser una métrica difícil de mejorar, por lo que te recomendamos consultar la guía para optimizar el INP para obtener más información.
Identifica las páginas con bajo rendimiento en Search Console
Si bien PSI es útil cuando tienes una URL específica que deseas probar o el sitio en su totalidad, Search Console puede ayudarte a segmentar tus esfuerzos en tipos de páginas en particular. Esto es especialmente útil si muchas páginas comparten temas o tecnologías comunes, y Search Console puede identificarlos correctamente.
En el informe de Métricas web esenciales de Search Console, se muestra el panorama general del rendimiento de tu sitio web, pero también puedes desglosar las páginas específicas que requieran atención. Con Search Console, también puedes hacer lo siguiente:
- Identifica los grupos de páginas individuales que necesitan mejoras y aquellos que proporcionan una buena experiencia del usuario.
- Obtén datos detallados sobre el rendimiento por URL agrupados por estado, métrica y grupos de páginas web similares (como las páginas de detalles de productos en un sitio web de comercio electrónico).
- Obtén informes detallados que detallan las URLs de buckets de cada categoría de calidad de la experiencia del usuario, tanto en dispositivos móviles como en computadoras.
Una vez que tengas algunas páginas específicas para analizar, puedes usar PSI como se explicó anteriormente para comprender mejor los problemas de esas páginas.
Paso 2: Depura y optimiza
En el paso 1, deberías haber identificado las páginas que requieren mejoras de rendimiento y también cuáles de las métricas de las Métricas web esenciales deseas mejorar. Puedes usar las herramientas de Google para obtener más información y comprender la causa raíz del problema.
- Ejecuta una auditoría de Lighthouse para obtener orientación a nivel de la página
- Usa la vista de métricas en vivo del panel de rendimiento para analizar las métricas web esenciales en tiempo real.
- Usa el seguimiento del panel Rendimiento para depurar problemas de rendimiento y probar cambios de código.
Para obtener una guía más detallada, consulta las siguientes guías:
Descubre oportunidades con Lighthouse
PageSpeed Insights ejecuta Lighthouse por ti, pero para el desarrollo local también es posible ejecutar Lighthouse desde las Herramientas para desarrolladores de Chrome, lo que es útil para validar las correcciones de forma local.
Un punto clave es validar que la auditoría de Lighthouse replique los problemas que intentas resolver (por ejemplo, problemas lentos de LCP o CLS). De forma predeterminada, Lighthouse solo evalúa la experiencia del usuario durante la carga de la página. Como es una herramienta de lab, también excluye INP en favor de TBT.
Cuando las métricas de Lighthouse sugieren un problema similar al que intentas resolver, la gran cantidad de información de sus auditorías puede ayudarte a identificar problemas y sugerir soluciones.
Puedes filtrar las auditorías solo para las métricas web esenciales que te interesan para enfocarte en las correcciones de problemas relacionados con una métrica específica:
Para la INP, usa las auditorías de TBT para identificar los problemas que pueden afectar esas métricas, pero ten en cuenta que, sin interacciones, Lighthouse tiene limitaciones en lo que puede diagnosticar.
Realiza análisis en tiempo real con la pantalla de métricas en vivo de Herramientas para desarrolladores de Chrome
La pantalla de métricas en vivo de Chrome DevTools en el panel Rendimiento muestra las Métricas web esenciales en tiempo real durante la carga de la página y mientras se navega por una página. Por lo tanto, puede capturar INP, así como los cambios de diseño que se producen después de la carga. También puedes ver información más detallada sobre cada métrica:
Si bien esta vista proporciona mucha información útil para identificar problemas de rendimiento, si deseas obtener aún más información, puedes desglosar con un registro.
Desglosa los datos con el panel de rendimiento
El panel Rendimiento de Chrome DevTools te permite registrar un perfil (o seguimiento) de todo el comportamiento de la página durante un período determinado.
Los tiempos de teclas, como el LCP, se muestran en el segmento de Tiempos. Haz clic en ellos para obtener más detalles.
El segmento Cambios de diseño destaca los cambios de diseño y, si haces clic en ellos, se proporcionan más detalles sobre los elementos que cambiaron para depurar el CLS.
Las tareas largas (que pueden generar problemas de INP) también se destacan con triángulos rojos.
Estas funciones, así como la información de otras partes del panel Rendimiento, pueden ayudarte a determinar si las correcciones tienen algún efecto en las métricas web esenciales de una página.
Cómo depurar las Métricas web esenciales en el campo
Las herramientas de Lab no siempre pueden identificar la causa de todos los problemas de las métricas web esenciales que afectan a tus usuarios. Esta es una de las razones por las que es tan importante recopilar tus propios datos de campo, ya que tienen en cuenta factores que los datos de laboratorio no pueden.
Consulta cómo depurar el rendimiento en el campo para obtener más información.
Paso 3: Supervisa los cambios
Una vez que hayas solucionado los problemas, debes asegurarte de que tengan el efecto deseado y de que los problemas nuevos no interrumpan tus métricas web esenciales. Esto requiere la supervisión de problemas de rendimiento como parte del flujo de trabajo del desarrollador para evitar que se lancen problemas de rendimiento a producción y supervisar los datos de campo con regularidad para garantizar que sea así.
Supervisa las solicitudes de rendimiento en entornos de integración continua (CI)
Lighthouse-CI te permite ejecutar auditorías de Lighthouse automáticamente en las confirmaciones de código para evitar que se introduzcan regresiones de rendimiento en el código. Esto puede verificar los tiempos de rendimiento (que están sujetos a variabilidad) o solo las auditorías de rendimiento, como una herramienta de linting para evitar prácticas incorrectas en el código.
Ver las tendencias de salud del sitio web con datos de campo
Si bien debes detectar y corregir todos los problemas de rendimiento antes de que lleguen a producción, es fundamental supervisar tus datos de campo con RUM para encontrar los que se te escapen. Existen muchos productos comerciales de RUM disponibles que pueden ayudarte con esto. La biblioteca de JavaScript web-vitals puede automatizar la recopilación de datos de campo de un sitio web y, de manera opcional, usar estos datos para potenciar paneles personalizados y sistemas de alertas.
En el caso de los sitios que no tienen una solución de RUM, puedes usar el panel de CrUX como análisis de tendencias básico de datos de campo. Informa lo siguiente sobre los sitios en CrUX:
- Descripción general del sitio, que segmenta las Métricas web esenciales en tipos de dispositivos móviles y computadoras de escritorio.
- Tendencia histórica por tipo de métrica, que es una distribución de las métricas a lo largo del tiempo para cada versión mensual disponible de datos del informe de CrUX.
- Datos demográficos de los usuarios, que ilustra la distribución de las vistas de página en un origen completo para los usuarios de cada grupo demográfico, incluidos los tipos de dispositivo y conexión efectiva.
El panel de CrUX se basa en el conjunto de datos de BigQuery de CrUX, que se actualiza una vez al mes. Este puede ser un buen recordatorio para que revises periódicamente tus Métricas web esenciales.
Conclusión
Garantizar experiencias del usuario rápidas y agradables requiere una mentalidad que priorice el rendimiento y la adopción de un flujo de trabajo para garantizar el progreso. Con las herramientas y los procesos adecuados para auditar, depurar y supervisar, puedes crear experiencias del usuario excelentes y mantenerte dentro de los umbrales definidos para obtener buenas métricas web esenciales.