入力レイテンシの推定は、Lighthouse レポートの [パフォーマンス] セクションでトラッキングされる 6 つの指標の 1 つです。各指標には、ページの読み込み速度に関するなんらかの要素が含まれます。
Lighthouse のレポートには、推定入力レイテンシがミリ秒単位で表示されます。
推定入力レイテンシで測定される内容
入力の推定レイテンシは、ページ読み込みの最もビジーな 5 秒間に、アプリがユーザー入力に応答するまでにかかる時間の推定値です。この監査のタイミングは、First Meaningful Paint からトレースの終わりまでです。これは操作可能になるまでの時間の約 5 秒後です。遅延が 50 ミリ秒を超えると、ユーザーがアプリの動作が遅いと感じる可能性があります。
RAIL パフォーマンス モデルでは、Lighthouse の推定入力レイテンシのターゲット スコアを 50 ミリ秒以内に、アプリがユーザー入力に対して 100 ミリ秒以内に応答することが推奨されています。なぜでしょうか。Lighthouse では、プロキシ指標（メインスレッドの可用性）を使用して、ユーザー入力に対するアプリの応答性を測定します。
Lighthouse では、アプリがユーザーの入力に完全に応答するまでに 50 ミリ秒かかると想定しています（JavaScript の実行から画面に新しいピクセルを物理的に描画するまで）。メインスレッドが 50 ミリ秒以上利用できない場合は、アプリがレスポンスを完了する十分な時間がとれません。
約 90% のユーザーが、Lighthouse の報告値以下の入力レイテンシに遭遇します。 10% のユーザーはレイテンシの上昇が予想されます。
入力レイテンシの推定スコアを改善する方法
ユーザー入力への応答を高速化するには、ブラウザでのコードの実行方法を最適化します。Google のレンダリング パフォーマンスのページに記載されている一連の手法を確認してください。これらのヒントは、メインスレッドを解放するウェブワーカーから計算のオフロード、計算の実行を減らすための CSS セレクタのリファクタリング、ブラウザ負荷の高い操作の量を最小限に抑える CSS プロパティの使用など、多岐にわたります。
推定入力レイテンシを手動で測定する方法
推定入力レイテンシを手動で測定するには、Chrome DevTools のタイムラインを使用して記録します。ワークフローの例については、メインスレッドの作業を減らすをご覧ください。 基本的な考え方は、記録の開始、測定するユーザー入力の実行、記録の停止、フレーム チャートの分析を行い、ピクセル パイプラインのすべてのステージが 50 ミリ秒以内に完了することです。