Time to Interactive（TTI）は、負荷の応答性を測定するためのラボの指標です。インタラクティブに見えても実際にはインタラクティブではないページを特定できます。TTI が高速であれば、ページが確実に利用可能になります。
TTI とは
TTI 指標はページが開始してからの経過時間を測定する その主要なサブリソースが読み込まれて ユーザーの入力にすばやく応答できます
パフォーマンス トレース 表示する手順は次のとおりです。
- First Contentful Paint（FCP）から始めます。
- 少なくとも 5 秒間、クワイエット ウィンドウを時間内に早送りします。 quiet window は、long かつ、処理中のタスクは ネットワーク GET リクエスト。
- サイレント ウィンドウの前の最後の長いタスクを後方に検索し、 長いタスクが見つからない場合は FCP。
- TTI は、クォート ウィンドウ（または （長いタスクが見つからない場合は FCP と同じ値）。
次の図に、上記の手順をわかりやすく示します。
従来、デベロッパーはページを最適化してレンダリング時間を短縮し、 TTI が犠牲になることもあります
サーバーサイド レンダリング（SSR）などの手法では、 インタラクティブに見える（つまり、リンクやボタンが画面に表示されている）ものの、そうでない 実際にインタラクティブであるという理由があります。これはメインスレッドがブロックされているか、 これらの要素を制御する JavaScript コードが読み込まれていないためです。
インタラクティブに見えても実際にはページで そうでない場合は、次の 2 つのいずれかの方法で反応します。
- 最良のシナリオでは、ページの応答が遅いことをお客様がイライラします。
- 最悪のシナリオではページが破損していると 退出します。ブランドの価値に対する信頼や信用を失うことさえあります。
この問題を回避するには、違いを最小限に抑えるよう FCP と TTI の間に位置付けられます。顕著な違いがある場合は ページのコンポーネントがまだ実装できていないことを、視覚的なインジケータで明確にします。 インタラクティブです。
TTI の測定方法
TTI は、 ハンズオンラボをご覧ください。TTI を測定する最良の方法は、 Lighthouse のパフォーマンス監査をサイトで行う。Lighthouse のドキュメント: TTI をご覧ください。
ラボツール
で確認できます。 <ph type="x-smartling-placeholder">優れた TTI スコアとは
優れたユーザー エクスペリエンスを提供するには、 操作可能5 秒未満（平均的なモバイル デバイスを使用したテスト時） ハードウェア。
ページの TTI が Lighthouse のパフォーマンス スコアに与える影響について詳しくは、 Lighthouse による TTI の決定方法 スコア。
TTI を改善する方法
Lighthouse を実行すると、特定のサイトの TTI を改善する方法を確認できます。 パフォーマンスの監査を行って、特定の 機会を見つけることです。
（任意のサイトについて）TTI 全般を改善する方法については、以下をご覧ください。 パフォーマンス ガイド: