Total Blocking Time

Total Blocking Time

Total Blocking Time (TBT) is one of the many metrics tracked by the Performance Scan on both desktop and mobile. Each metric captures a different aspect of your application's performance.

The resulting TBT is shown in milliseconds:

What does TBT measure?

The TBT measures the time between the First Contentful Paint(FCP) and Time to Interactive(TTI), where the main thread was blocked long enough to prevent input responsiveness.

The main thread is considered "blocked" any time there is a Long Task, a task that runs on the main thread for more than 50 milliseconds (ms). The main thread is considered "blocked" when the browser cannot interrupt it in its current task.

In the event a user does interact with the page in the middle of such a task, the browser must wait for the task to finish before it can respond. If a task is long enough (e.g. anything above 50 ms), it's likely the user will notice the delay and perceive the page as sluggish.

The blocking time of a given long task is its duration beyond 50 ms. The total blocking time is the sum of the blocking time for each long task that occurs between FCP and TTI.

How does TBT relate to TTI?

TBT is a great companion metric for TTI, because it helps quantify the severity of how non-interactive a page is before it becomes reliably interactive.

TTI considers a page "reliably interactive" if the main thread has been free of long tasks for at least five seconds. This means that three, 51 ms tasks spread out over 10 seconds can push back TTI just as far as a single 10-second long task, but those two scenarios would feel very different to a user trying to interact with the page. In the first case, three, 51 ms tasks would have a TBT of 3 ms. Whereas a single, 10-second long tasks would have a TBT of 9950 ms. The larger TBT value in the second case quantifies the worse experience.

I would like to learn more

For more info on the TBT metric, you can read this article on https://web.dev.