Skip to content
Aprender Medir Blog Case studies About
Join and donate to 🇺🇦 DevFest for Ukraine, a charitable tech conference happening June 14–15 supported by Google Developers and Google Cloud.
En esta página
  • Qué mide la TBT
  • Cómo determina Lighthouse su puntaje TBT
  • Cómo mejorar su puntaje TBT
  • How to improve your overall Performance score
  • Recursos

Total Blocking Time

Oct 9, 2019 — Actualizado Jun 4, 2021
Available in: 日本語, 한국어, Português, Русский, 中文, English
Appears in: Auditorías de rendimiento
En esta página
  • Qué mide la TBT
  • Cómo determina Lighthouse su puntaje TBT
  • Cómo mejorar su puntaje TBT
  • How to improve your overall Performance score
  • Recursos

El Total Blocking Time o TBT (tiempo de bloqueo total) es una de las métricas que se registran en la sección Rendimiento del informe Lighthouse. Cada métrica captura algún aspecto de la velocidad de carga de la página.

El informe Lighthouse muestra el TBT en milisegundos:

Una captura de pantalla de la auditoría Lighthouse Tiempo total de bloqueo

Qué mide la TBT #

La TBT mide la cantidad total de tiempo que una página está bloqueada para que no responda a la entrada del usuario, como los clics del ratón, toques de la pantalla o pulsaciones del teclado. La suma se calcula sumando la parte de bloqueo de todas las tareas largas entre First Contentful Paint (primer despliegue de contenido) y Time to Interactive (tiempo de interacción). Cualquier tarea que se ejecute durante más de 50 ms es una tarea larga. La cantidad de tiempo después de 50 ms es la parte de bloqueo. Por ejemplo, si Lighthouse detecta una tarea de 70 ms de duración, la porción de bloqueo sería de 20 ms.

Cómo determina Lighthouse su puntaje TBT #

Su puntaje TBT es una comparación del tiempo TBT de su página y el tiempo TBT de millones de sitios reales cuando se carga en dispositivos móviles. Consulte Cómo se determinan las puntuaciones de métricas para saber cómo se establecen los umbrales de puntuación de Lighthouse.

Esta tabla muestra cómo interpretar su puntaje TBT:

Tiempo TBT
(en milisegundos)
Codificación de color
0-200Verde (rápido)
200-600Naranja (moderado)
Más de 600Rojo (lento)
See the Lighthouse performance scoring post to learn how your page's overall performance score is calculated.

Cómo mejorar su puntaje TBT #

Consulte ¿Qué está causando mis tareas largas? para aprender a diagnosticar la causa principal de tareas largas con el panel Rendimiento de Chrome DevTools.

En general, las causas más comunes de tareas largas son:

  • Carga, análisis o ejecución de JavaScript innecesarios. Al analizar su código en el panel Rendimiento, es posible que descubra que el hilo principal está realizando un trabajo que no es realmente necesario para cargar la página. Reducir las cargas útiles de JavaScript con la división de código, eliminar el código no utilizado o cargar JavaScript de terceros de manera eficiente debería mejorar su puntaje TBT.
  • Declaraciones de JavaScript ineficientes. Por ejemplo, después de analizar su código en el panel Rendimiento, suponga que ve una llamada a document.querySelectorAll('a') que devuelve 2000 nodos. Refactorizar su código para usar un selector más específico que solo devuelva 10 nodos debería mejorar su puntaje TBT.
La carga, el análisis o la ejecución innecesarios de JavaScript suelen ser una oportunidad mucho mayor de mejora en la mayoría de los sitios.

How to improve your overall Performance score #

Unless you have a specific reason for focusing on a particular metric, it's usually better to focus on improving your overall Performance score.

Use the Opportunities section of your Lighthouse report to determine which improvements will have the most value for your page. The more significant the opportunity, the greater the effect it will have on your Performance score. For example, the Lighthouse screenshot below shows that eliminating render-blocking resources will yield the biggest improvement:

Lighthouse: Opportunities section

See the Performance audits landing page to learn how to address the opportunities identified in your Lighthouse report.

Recursos #

  • Código fuente para la auditoría Total Blocking Time
  • ¿Las tareas largas de JavaScript están retrasando su Time to Interactive?
  • Optimizar la demora de la primera entrada
  • Primer despliegue de contenido
  • Tiempo de interacción
  • Reducir las cargas útiles de JavaScript con la división de código
  • Eliminar el código no utilizado
  • Cargar de manera eficiente los recursos de terceros
Última actualización: Jun 4, 2021 — Mejorar el artículo
Return to all articles
Compartir
suscribir

Contribute

  • Presentar un error
  • Ver fuente

Contenido relevante

  • developer.chrome.com
  • Chrome Actualizaciones
  • Web Fundamentals
  • Case studies
  • Podcasts
  • Shows

Conectar

  • Twitter
  • YouTube
  • Google Developers
  • Chrome
  • Firebase
  • Google Cloud Platform
  • Todos los productos
  • Condiciones y privacidad
  • Principios de la Comunidad

Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 4.0 License, and code samples are licensed under the Apache 2.0 License. For details, see the Google Developers Site Policies.