Total Blocking Time (TBT)
¿Qué es TBT? #
La métrica Total Blocking Time (TBT) mide la cantidad total de tiempo entre First Contentful Paint: Primer despliegue del contenido (FCP) y Time to Interactive: Tiempo para interactuar (TTI) donde el subproceso principal estuvo bloqueado durante el tiempo suficiente para evitar la respuesta de entrada.
El subproceso principal se considera "bloqueado" cada vez que hay una Tarea larga, una tarea que se ejecuta en el subproceso principal durante más de 50 milisegundos (ms). Decimos que el subproceso principal está "bloqueado" porque el navegador no puede interrumpir una tarea que está en curso. Así que en el caso de que un usuario interactúe con la página en medio de una tarea larga, el navegador debe esperar a que la tarea termine antes de que pueda responder.
Si la tarea es lo suficientemente larga (por ejemplo, cualquier cosa que supere los 50 ms), es probable que el usuario se dé cuenta de la demora y perciba que la página es lenta o poco funcional.
El tiempo de bloqueo de una tarea larga determinada es su duración superior a 50 ms. Y el tiempo de bloqueo total de una página es la suma del tiempo de bloqueo para cada tarea larga que se produce entre FCP y TTI.
Por ejemplo, considere consultar el siguiente diagrama del subproceso principal del navegador durante la carga de la página:
La línea de tiempo anterior tiene cinco tareas, tres de las cuales son tareas largas porque su duración supera los 50 ms. En el siguiente diagrama se muestra el tiempo de bloqueo para cada una de las tareas largas:
Entonces, mientras que el tiempo total dedicado a ejecutar tareas en el subproceso principal es de 560 ms, solo 345 ms de ese tiempo se considera como tiempo de bloqueo.
| Duración de la tarea | Tiempo de bloqueo de la tarea | |
|---|---|---|
| Tarea uno | 250 ms | 200 ms |
| Tarea dos | 90 ms | 40 ms |
| Tarea tres | 35 ms | 0 ms |
| Tarea cuatro | 30 ms | 0 ms |
| Tarea cinco | 155 ms | 105 ms |
| Tiempo total de bloqueo | 345 ms | |
¿Cómo se relaciona TBT con TTI? #
TBT es una gran métrica complementaria para TTI porque ayuda a cuantificar la gravedad de la falta de interactividad de una página antes de que se convierta en interactiva confiable.
TTI considera que una página es "confiablemente interactiva" si el subproceso principal ha estado libre de tareas largas durante al menos cinco segundos. Esto significa que tres tareas de 51 ms repartidas a lo largo de 10 segundos pueden demorar el TTI tanto como una sola tarea de 10 segundos de duración, pero estos dos escenarios serían muy diferentes para un usuario que intenta interactuar con la página.
En el primer caso, tres tareas de 51 ms tendrían un TBT de 3 ms. Mientras que una sola tarea de 10 segundos de duración tendría un TBT de 9, 950 ms. El valor mayor de TBT en el segundo caso cuantifica la peor experiencia.
Cómo medir TBT #
TBT es una métrica que debe medirse en el laboratorio . La mejor manera de medir TBT es ejecutar una auditoría de desempeño Lighthouse en su sitio. Consulte la documentación de Lighthouse sobre TBT para obtener información sobre su uso.
Herramientas de laboratorio #
¿Qué es una buena puntuación TBT? #
Para ofrecer una buena experiencia de usuario, los sitios deben esforzarse por tener un Total Blocking Time inferior a 300 milisegundos cuando se prueban en el hardware de un dispositivo móvil promedio.
Para obtener más información sobre cómo la TBT de su página afecta a su puntuación de rendimiento de Lighthouse, consulte Cómo determina Lighthouse su puntuación TBT
Cómo mejorar TBT #
Para aprender a mejorar TBT para un sitio específico, puede ejecutar una auditoría de desempeño Lighthouse y prestar atención a cualquier oportunidad específica que sugiera la auditoría.
Para saber cómo mejorar la TBT en general (para cualquier sitio), consulte las siguientes normas de rendimiento:
- Reducir el impacto en el código de terceros
- Reducir el tiempo de ejecución de JavaScript
- Minimizar el trabajo del subproceso principal
- Mantener la cantidad de solicitudes bajas y los tamaños de transferencia reducidos