WebPerformance

CLS はページを表示する最初の段階で決まることが多い

投稿日:

CLS の値は、session window というグループでレイアウトシフトが分けられ(時系列での分割)、その中で一番大きいものが、そのページの CLS値となります。

Webページというのは上の位置であればあるほど、当然その下にある要素が多いため、レイアウトシフトの規模は大きくなるはずです(下の要素がすべてずれるため)。つまり、ページの上部で起きたレイアウトシフトの値が、そのままそのページの CLS値になる(ことが多い)ということが言えそうです。その後にページをスクロールしてレイアウトシフトが再度起きたとしても、ページのCSL値は変わらない(ことが多い)ということです。

参考

📂-WebPerformance

執筆者:labo


comment

メールアドレスが公開されることはありません。

関連記事

Web Vitals

Lighthouse が指摘する「Serves images with low resolution」について

Lighthouse が指摘する「Serves images with low resolution」について。

Web Vitals

async script をより早く実行させる

async script をより早く実行させる方法を紹介します。

Web Vitals

Webページの高速化とSEOの関係

Webページの高速化とSEOの関係について書きます。

Web Vitals

CLS対策:ページ上部にAdSense自動広告を表示させない

CLS対策:ページ上部にAdSense自動広告を表示させないようにしましょう。

Web Vitals

ファーストビュー上のアニメーションGIFはMP4に変換して使うことを検討する

ファーストビュー上のアニメーションGIFはMP4に変換して使うことを検討しましょう