Total Blocking Time（TBT）は、読み込みの応答性を測定するための重要なラボ指標です。これは、First Contentful Paint（FCP）後、ユーザー入力へのレスポンスを妨げるのに十分な時間メインスレッドがブロックされた合計時間を測定します。TBT を短くすると、ページが使用可能になります。
デフォルトでは、Lighthouse は操作可能になるまでの時間（TTI）が経過すると TBT のモニタリングを停止します。また、ページの読み込みを測定する他のラボツールも停止します。詳細については、TBT と TTI の関係をご覧ください。
長時間タスク（メインスレッドで 50 ミリ秒（ms）を超えて実行されるタスク）が発生すると、メインスレッドは「ブロック中」と見なされます。ブラウザは進行中のタスクを割り込みできないため、メインスレッドは「ブロック」されています。長いタスクの途中でユーザーがページを操作しようとした場合、ブラウザはタスクが終了するまで待ってから応答する必要があります。
タスクが 50 ミリ秒以上ブロックされていると、ユーザーは遅延に気づき、ページの動作が遅い、または破損していると感じる可能性が高くなります。
特定の長いタスクのブロック時間は、実行時間が 50 ms を超える時間です。ページの合計ブロック時間は、測定期間に FCP の後に発生した各長いタスクのブロック時間の合計です（通常はページ読み込みツールの TTI、他のツールの合計トレース時間）。
たとえば、次の図は、ページの読み込み時のブラウザのメインスレッドを示しています。
このタイムラインには 5 つのタスクがあり、そのうちの 3 つは時間が 50 ミリ秒を超えているため、長いタスクです。次の図は、それぞれの長いタスクのブロック時間を示しています。
同じタスクにブロック時間のマークを付けて。メインスレッドでタスクの実行に費やされた合計時間は 560 ミリ秒で、そのうち 345 ミリ秒はブロッキング時間とみなされます。
| タスクの期間 | タスクのブロック時間 | |
|---|---|---|
| タスク 1 | 250 ミリ秒 | 200 ミリ秒 |
| タスク 2 | 90 ミリ秒 | 40 ミリ秒 |
| タスク 3 | 35 ミリ秒 | 0 ミリ秒 |
| タスク 4 | 30 ミリ秒 | 0 ミリ秒 |
| タスク 5 | 155 ミリ秒 | 105 ミリ秒 |
| Total Blocking Time | 345 ミリ秒 | |
TBT と TTI の関係
TBT は一定期間にわたって測定されます。Lighthouse など、従来からページの読み込みを測定していた一部のラボツールでは、TTI までの TBT が測定されていました。これは、ページが確実にインタラクティブになる前に、ページがインタラクティブでない程度の重大度を定量化するのに役立つためです。ただし、Lighthouse Timespan モードなどで、TTI 以外にも TBT の測定を継続できます。
TTI は、メインスレッドで長いタスクが少なくとも 5 秒間解放されていた場合、そのページは「確実にインタラクティブ」であるとみなします。つまり、10 秒にわたって分散した 51 ms の 3 つのタスクが、単一の 10 秒タスクと同じくらい、TTI を延期できます。
ただし、ユーザーがページを操作しようとする場合、この 2 つのシナリオはまったく異なるように感じられます。51 ミリ秒のタスクが 3 つある場合の TBT は 3 ミリ秒ですが、10 秒のタスクの TBT は 9950 ミリ秒であるため、ユーザー エクスペリエンスが大幅に低下します。
TBT は外れ値をより正確に表すため、TTI で TBT 測定が停止しても、多くの場合、TTI よりも有用な指標となります。
TBT を測定する
TBT はラボで測定すべき指標です。TBT を測定する最善の方法は、サイトで Lighthouse のパフォーマンス監査を実施することです。使用方法の詳細については、TBT に関する Lighthouse のドキュメントをご覧ください。
ラボ用ツール
TBT スコアの良し悪しは？
優れたユーザー エクスペリエンスを提供するには、平均的なモバイル ハードウェアでテストしたときの TBT を 200 ミリ秒未満にする必要があります。
ページの TBT が Lighthouse のパフォーマンス スコアに与える影響について詳しくは、Lighthouse による TBT スコアの決定方法をご覧ください。
TBT を改善
特定のサイトの TBT を改善する方法を確認するには、Lighthouse のパフォーマンス監査を実行し、監査で提案された特定の最適化案を確認します。
任意のサイトで TBT を改善する一般的な方法については、次のパフォーマンス ガイドをご覧ください。