Latencia de entrada estimada

La latencia de entrada estimada es una de las seis métricas de las que se hace un seguimiento en la sección Rendimiento del informe de Lighthouse. Cada métrica registra algún aspecto de la velocidad de carga de la página.

Los informes de Lighthouse muestran la latencia de entrada estimada en milisegundos:

Captura de pantalla de la auditoría de latencia de entrada estimada de Lighthouse

Qué mide la latencia de entrada estimada

La latencia de entrada estimada es una estimación del tiempo que tarda tu app en responder a las entradas del usuario durante el período de mayor actividad de 5 segundos en la carga de la página. El tiempo de esta auditoría es desde la primera pintura significativa hasta el final del seguimiento, que es aproximadamente 5 segundos después del tiempo de carga. Si la latencia es superior a 50 ms, es posible que los usuarios perciban que la app está rezagada.

El modelo de rendimiento RAIL recomienda que las apps respondan a las entradas del usuario en un plazo de 100 ms, mientras que la puntuación objetivo de latencia de entrada estimada de Lighthouse es de 50 ms. ¿Por qué? Lighthouse usa una métrica de proxy (disponibilidad del subproceso principal) para medir qué tan bien responde tu app a las entradas del usuario.

Lighthouse supone que tu app necesita 50 ms para responder por completo a la entrada del usuario (desde realizar ejecuciones de JavaScript hasta pintar físicamente los píxeles nuevos en la pantalla). Si tu subproceso principal no está disponible durante 50 ms o más, no deja suficiente tiempo para que la app complete la respuesta.

Aproximadamente el 90% de los usuarios se encontrará con la cantidad de latencia de entrada informada por Lighthouse o menos. El 10% de los usuarios puede esperar una latencia más alta.

Cómo mejorar la puntuación de latencia de entrada estimada

Para que tu app responda a las entradas del usuario más rápido, optimiza la forma en que se ejecuta el código en el navegador. Consulta la serie de técnicas que se describen en la página Rendimiento de la renderización de Google. Estas sugerencias van desde el procesamiento de descarga hasta trabajadores web para liberar el subproceso principal, la refactorización de los selectores CSS para realizar menos cálculos y el uso de propiedades de CSS que minimizan la cantidad de operaciones que requieren un uso intensivo del navegador.

Cómo medir la latencia de entrada estimada de forma manual

Para medir la latencia de entrada estimada de forma manual, realiza una grabación con Timeline de las Herramientas para desarrolladores de Chrome. Consulta Cómo realizar menos trabajo del subproceso principal para ver un ejemplo del flujo de trabajo. La idea básica es iniciar una grabación, realizar la entrada del usuario que deseas medir, detener la grabación y, luego, analizar el gráfico de llamas para asegurarte de que todas las etapas de la canalización de píxeles se completen en 50 ms.

Recursos