【コア ウェブ バイタル】CLSと同じタイミングでLCPの定義も更新

[レベル: 上級]

Search Console をはじめ、PageSpeed Insights や Lighthouse などのコア ウェブ バイタルを測定する各種ツール新しい定義での CLS でスコアを測定するように 6 月 1 日にアップデートされました。

同じタイミングで LCP の取得方法も更新されています。

Largest Contentful Paint has undergone adjustments in recent Chrome versions and has been updated similarly in CrUX.

後でページから削除される要素は LCP 対象のまま

変更前後を簡潔に比較すると次のようになります。

  • 変更前: ページから要素が削除されると(DOM からなくなると)その要素は LCP の有効な候補ではなくなり、ページに存在する別の要素から LCP 候補が選ばれる。LCP 候補を見つける新たな処理がすぐに発生する。
  • 変更後: ページから要素が削除されてもその要素は LCP 候補のまま。その要素よりも大きなサイズの LCP 要素が見つかった場合にのみ、LCP 候補の選択が開始される。

影響を受けるサイト

LCP 取得方法の変更で特に影響を受けそうなのは、同じサイズの画像を複数回挿入するサイトです。
カルーセルを使っていたり、サーバーサイドレンダリングする JavaScript フレームワークを使っていたりするサイトが該当するかもしれません。

影響は良い影響です。
通常は LCP スコアが改善するでしょう。

この LCP 定義変更は、2021 年 1 月にリリースされた Chrome 88(安定版)の Web API には反映されていましたが、CrUX など一部のツールには反映されていませんでした。
ツールを利用している開発者は認識しておいてください(変更のソースコードはこちら)。

コア ウェブ バイタルの数値を取得して改善に役立てているサイトは、こうした定義の変更に敏感になっていたほうがいいと思います。
各種ツールの Changelog ページをこまめに確認したり、CrUX の Google グループに参加したりすることをオススメします。