フロントエンドのパフォーマンス指標

|メトリクス|意味| |-|-| |FP|最初のペイント| |FCP|最初のコンテンツペイント| |LCP|最大コンテンツペイント| |FID|最初の入力遅延| 1 秒あたりの送信フレーム数|

LCP: ビューポート内の最大の要素の描画時間。ページ内の最大の要素はレンダリングプロセス中に変更される可能性があるため、この時間はページレンダリングの変化に応じて変化します。また、このインジケーターは、ユーザーが操作を行った後、記録を停止します。初めて
FID: ユーザーが FCP と TTI の間で最初にページを操作したときの応答の遅延を記録します。この指標は実際には非常に理解しやすいもので、ユーザーインタラクションイベントのトリガーからページの応答までにどれくらいの時間がかかるかを示すもので、長いタスクが含まれている場合、必然的に応答時間も長くなります。
CLS: ページ上の予期しない変位変動が記録されます。

FP と FCP の 2 つの指標が 2 秒以内に完了した場合、ページエクスペリエンスは優れていると見なされます。
LCP は、ページの読み込みパフォーマンスを測定するために使用され、優れたユーザーエクスペリエンスを提供するために、ページの最初の読み込み開始後2.5 秒以内に LCP が発生する必要があります。
インタラクティブなパフォーマンスを測定する FID は、優れたユーザーエクスペリエンスを提供するために、ページの FID が100 ミリ秒未満である必要があります。
CLS、視覚的な安定性を測定します。優れたユーザーエクスペリエンスを提供するには、ページの CLS を0.1 未満に保つ必要があります。
FPS：
フレームレート50 ～ 60 FPSのアニメーションは非常にスムーズで快適です。
フレームレートが30 ～ 50 FPSのアニメーションの場合、各人の感度が異なるため、快適さのレベルは人によって異なります。
フレームレートが30 FPS未満のアニメーションは、明らかに途切れや不快感を感じさせます。
フレームレートの変動が大きいアニメーションも、行き詰まりを感じさせる可能性があります。