ざっくり
計測されるパフォーマンス値は主に以下の6つの項目と重要度で評価される。
| 項目 | 重要度（Weighting） | 改善が必要 | 貧弱 |
|---|---|---|---|
| TBT (Total Blocking Time) | 30 | x>1800 | x>3000 |
| LCP (Largest Contentful Paint) | 25 | x>3400 | x>5800 |
| CLS (Cumulative Layout Shift) | 15 | x>2500 | x>4000 |
| FCP (First Contentful Paint) | 10 | x>3800 | x>7300 |
| SI (Speed Index) | 10 | x>200 | x>600 |
| TTI(Time to Interactive) | 10 | x>0.1 | x>0.25 |
計測系
解説系
LCP
TBT
TTI
First Contentful Paint (FCP) から開始します。
少なくとも 5 秒間の落ち着いている期間を時間の経過順に探していきます。この場合の落ち着いている期間とは、長く時間がかかっているタスクがなく、実行中のネットワーク GET リクエストが 2 件以下となる期間として定義されます。
https://web.dev/i18n/ja/tti/
https://web.dev/lighthouse-total-blocking-time/
SI
その他
実践系
すぐやれそうなこと
- headでjsを読み込んでいる場合は、deferをつける。
- 開発者ツールでJSなどがLONG TASKとしてマークされた場合は、JSの分割や実装方法を見直す。
- JS、CSSから、無駄な記述、importなどを省く。
- 画像を軽量化する。