El objetivo del Informe sobre la experiencia del usuario en Chrome es ayudar a la comunidad web a comprender la distribución y la evolución del rendimiento real de los usuarios. Hasta la fecha, nos enfocamos en las métricas de pintura y carga de página, como First Contentful Paint (FCP) y Onload (OL), que nos ayudaron a comprender el rendimiento visual de los sitios web para los usuarios. A partir del lanzamiento de junio de 2018, estamos experimentando con una nueva métrica centrada en el usuario que se enfoca en la interactividad de las páginas web: el retraso de primera entrada (FID). Esta nueva métrica nos permitirá comprender mejor qué tan responsivos son los sitios web a las entradas del usuario.
Recientemente, el FID estuvo disponible en Chrome como una prueba de origen, lo que significa que los sitios web pueden habilitar la experimentación con esta nueva función de la plataforma web. Del mismo modo, la FID estará disponible en el informe de UX de Chrome como una métrica experimental, lo que significa que estará disponible durante la prueba de origen en un espacio de nombres "experimental" independiente.
Cómo se mide el FID
Entonces, ¿qué es exactamente el FID? A continuación, se muestra cómo se define en la entrada de blog del anuncio sobre el retraso de la primera entrada:
El retraso de primera entrada (FID) mide el tiempo que transcurre desde que un usuario interactúa por primera vez con tu sitio (es decir, cuando hace clic en un vínculo, presiona un botón o usa un control personalizado impulsado por JavaScript) hasta que el navegador puede responder a esa interacción.
Es como medir el tiempo que transcurre desde que se toca el timbre de alguien hasta que abre la puerta. Si tarda mucho tiempo, puede haber muchos motivos. Por ejemplo, tal vez la persona esté lejos de la puerta o no pueda moverse con rapidez. Del mismo modo, es posible que las páginas web estén ocupadas realizando otras tareas o que el dispositivo del usuario sea lento.
Explora FID en el informe de UX de Chrome
Con un mes de datos de FID de millones de orígenes, ya hay una gran cantidad de estadísticas interesantes que descubrir. Observemos algunas consultas que demuestran cómo extraer estas estadísticas del Informe de UX de Chrome en BigQuery.
Comencemos por consultar el porcentaje de experiencias rápidas de FID en developers.google.com. Podemos definir una experiencia rápida en la que un FID sea inferior a 100 ms. Según las recomendaciones de RAIL, si el retraso es de 100 ms o más, el usuario debería sentirse instantáneo.
SELECT
ROUND(SUM(IF(fid.start < 100, fid.density, 0)), 4) AS fast_fid
FROM
`chrome-ux-report.all.201806`,
UNNEST(experimental.first_input_delay.histogram.bin) AS fid
WHERE
origin = 'https://developers.google.com'
Los resultados muestran que el 95% de las experiencias de FID en este origen se perciben como instantáneas. Parece muy bueno, pero ¿cómo se compara con todos los orígenes del conjunto de datos?
SELECT
ROUND(SUM(IF(fid.start < 100, fid.density, 0)) / SUM(fid.density), 4) AS fast_fid
FROM
`chrome-ux-report.all.201806`,
UNNEST(experimental.first_input_delay.histogram.bin) AS fid
Los resultados de esta consulta muestran que el 84% de las experiencias de FID son inferiores a 100 ms. Por lo tanto, developers.google.com está por encima del promedio.
A continuación, intentemos dividir estos datos para ver si hay una diferencia entre el porcentaje de FID rápido en computadoras de escritorio y en dispositivos móviles. Una hipótesis es que los dispositivos móviles tienen valores de FID más lentos, posiblemente debido a un hardware más lento en comparación con las computadoras de escritorio. Si la CPU es menos potente, es posible que esté más ocupada durante más tiempo y que las experiencias de FID sean más lentas.
SELECT
form_factor.name AS form_factor,
ROUND(SUM(IF(fid.start < 100, fid.density, 0)) / SUM(fid.density), 4) AS fast_fid
FROM
`chrome-ux-report.all.201806`,
UNNEST(experimental.first_input_delay.histogram.bin) AS fid
GROUP BY
form_factor
form_factor | fast_fid |
---|---|
computadora | 96.02% |
teléfono | 79.90% |
tablet | 76.48% |
Los resultados corroboran nuestra hipótesis. Las computadoras de escritorio tienen una densidad acumulativa más alta de experiencias de FID rápidas que los factores de forma de teléfonos y tablets. Para comprender por qué existen estas diferencias, p. ej., el rendimiento de la CPU, se requerirían pruebas A/B fuera del alcance del informe de UX de Chrome.
Ahora que vimos cómo identificar si un origen tiene experiencias de FID rápidas, analizemos algunos orígenes que tienen un rendimiento muy bueno.
Ejemplo 1: http://secretlycanadian.com
Este origen tiene un 98% de experiencias de FID por debajo de 100 ms. ¿Cómo lo hacen? Si analizamos cómo se compiló en WebPageTest, podemos ver que es una página de WordPress con muchas imágenes, pero tiene 168 KB de JavaScript que se ejecuta en alrededor de 500 ms en nuestra máquina de lab. Según el HTTP Archive, no se trata mucho de JavaScript, que ubica a esta página en el percentil 28.
La barra rosa que abarca de 2.7 a 3.0 segundos es la fase de Análisis de HTML. Durante este tiempo, la página no es interactiva y parece visualmente incompleta (consulta “3.0s” en la tira de película anterior). Después de eso, se dividen las tareas largas que sí se deben procesar para garantizar que el subproceso principal permanezca inactivo. Las líneas rosas de la fila 11 demuestran cómo el trabajo de JavaScript se distribuye en ráfagas rápidas.
Ejemplo 2: https://www.wtfast.com
Este origen tiene un 96% de experiencias de FID instantáneas. Carga 267 KB de JavaScript (percentil 38 en HTTP Archive) y los procesa durante 900 ms en la máquina del lab. La tira de película muestra que la página tarda unos 5 segundos en pintar el fondo y alrededor de 2 segundos más en pintar el contenido.
Lo más interesante de los resultados es que no se ve nada interactivo mientras el subproceso principal está ocupado entre 3 y 5 segundos. En realidad, es la lentitud del FCP de esta página lo que mejora el FID. Este es un buen ejemplo de la importancia de usar muchas métricas para representar la experiencia del usuario.
Comenzar a explorar
Puedes obtener más información sobre el FID en el episodio de esta semana de The State of the Web:
Tener los FID disponibles en el Informe de UX de Chrome nos permite establecer un modelo de referencia de experiencias de interactividad. Con este modelo de referencia, podemos observar su cambio en versiones futuras o comparar orígenes individuales. Si quieres comenzar a recopilar los FID en las mediciones del campo de tu sitio, regístrate en la prueba de origen. Para ello, ve a bit.ly/event-timing-ot y selecciona la función Tiempo de eventos. Y, por supuesto, comienza a explorar el conjunto de datos para obtener estadísticas interesantes sobre el estado de la interactividad en la Web. Esta es una métrica experimental, así que envíanos tus comentarios y comparte tu análisis en el grupo de debate del Informe sobre la experiencia del usuario en Chrome o en @ChromeUXReport en Twitter.