Общее время блокировки (TBT)

Метрика «Общее время блокировки» (TBT) измеряет общее количество времени после первой отрисовки содержимого (FCP), когда основной поток был заблокирован на достаточно долгое время, чтобы предотвратить реагирование на ввод.

По умолчанию Lighthouse прекращает мониторинг TBT после Time to Interactive (TTI) , как и некоторые другие лабораторные инструменты, измеряющие загрузку страницы. См. Как TBT соотносится с TTI? .

Основной поток считается «заблокированным» каждый раз, когда существует длинная задача — задача, которая выполняется в основном потоке более 50 миллисекунд. Мы говорим, что основной поток «заблокирован», потому что браузер не может прервать выполняемую задачу. Таким образом, в случае, если пользователь взаимодействует со страницей во время выполнения долгой задачи, браузеру придется дождаться завершения задачи, прежде чем он сможет ответить.

Если задача достаточно длинная (более 50 миллисекунд), вполне вероятно, что пользователь заметит задержку и воспримет страницу как медленную или сломанную.

Время блокировки данной длинной задачи — это ее продолжительность более 50 миллисекунд. А общее время блокировки страницы представляет собой сумму времени блокировки для каждой длительной задачи, возникающей после FCP за измеренный период времени (обычно TTI для инструментов загрузки страниц или общее время трассировки для других инструментов).

Например, рассмотрим следующую диаграмму основного потока браузера во время загрузки страницы:

Временная шкала задач в главном потоке
График выполнения задач в основном потоке.

Временная шкала, изображенная на предыдущем изображении, содержит пять задач, три из которых являются длинными задачами, поскольку их продолжительность превышает 50 миллисекунд. На следующей диаграмме показано время блокировки для каждой из длинных задач:

Временная шкала задач в основном потоке, показывающая время блокировки.
Те же задачи, с указанием времени блокировки.

Таким образом, хотя общее время, затрачиваемое на выполнение задач в основном потоке, составляет 560 миллисекунд, только 345 миллисекунд из этого времени считаются временем блокировки.

Длительность задачи (миллисекунды) Время блокировки задачи (миллисекунды)
Задача первая 250 200
Задача вторая 90 40
Задача третья 35 0
Задача четвертая 30 0
Задача пятая 155 105
Общее время блокировки 345 миллисекунд

Как ТБТ соотносится с TTI?

ТБТ измеряется в течение определенного периода времени. Для некоторых лабораторных инструментов, которые традиционно измеряют загрузку страниц, включая Lighthouse, TBT измеряется вплоть до TTI, поскольку он помогает количественно оценить степень неинтерактивности страницы до того, как она станет надежно интерактивной. Однако TBT также можно продолжать измерять после загрузки страницы и, следовательно, после TTI, например, в режиме Lighthouse Timespan.

TTI считает страницу «надежно интерактивной», если в основном потоке не было длительных задач в течение как минимум пяти секунд. Это означает, что три задачи по 51 мс, распределенные по 10 секундам, могут отодвинуть TTI так же далеко, как и одна задача длительностью 10 секунд, но эти два сценария будут сильно отличаться для пользователя, пытающегося взаимодействовать со страницей.

В первом случае три задачи по 51 мс будут иметь TBT 3 миллисекунды . В то время как для одной задачи продолжительностью 10 секунд TBT будет составлять 9950 миллисекунд . Большее значение TBT во втором случае количественно характеризует худшие впечатления.

Этот пример показывает, почему TBT часто является лучшим показателем, чем TTI, поскольку он менее подвержен выбросам. Это справедливо даже в том случае, когда TTI используется в качестве конечной точки для TBT.

Как измерить ТБТ

ТБТ – это показатель, который следует измерять в лаборатории . Лучший способ измерить TBT — провести аудит производительности Lighthouse на вашем сайте. Подробности использования см. в документации Lighthouse по TBT .

Лабораторные инструменты

Что такое хороший показатель TBT?

Чтобы обеспечить хорошее взаимодействие с пользователем, сайты должны стремиться к тому, чтобы общее время блокировки составляло менее 200 миллисекунд при тестировании на среднем мобильном оборудовании .

Подробную информацию о том, как TBT вашей страницы влияет на показатель производительности Lighthouse, см. в разделе «Как Lighthouse определяет ваш показатель TBT».

Как улучшить ТБТ

Чтобы узнать, как улучшить TBT для конкретного сайта, вы можете запустить аудит производительности Lighthouse и обратить внимание на любые конкретные возможности, которые предлагает аудит.

Чтобы узнать, как улучшить TBT в целом (для любого сайта), обратитесь к следующим руководствам по производительности: