CLSはユーザ操作でレイアウトの大きな変化が500ms間発生しないかをスコア化したメトリクス。 0,1以下が目標値。レイアウトのガタッ、FOUT、画像読み込み、動的なコンテンツの追加など。最初からサイズの規定しておくこと

efcl のブックマーク 2020/05/09 23:40

<blockquote class="hatena-bookmark-comment"><a class="comment-info" href="https://b.hatena.ne.jp/entry/4685260968221738498/comment/efcl" data-user-id="efcl" data-entry-url="https://b.hatena.ne.jp/entry/s/web.dev/articles/optimize-cls" data-original-href="https://web.dev/articles/optimize-cls" data-entry-favicon="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fweb.dev%2Farticles%2Foptimize-cls" data-user-icon="/users/efcl/profile.png">Optimize Cumulative Layout Shift  |  Articles  |  web.dev</a><ul class="comment-tag" style="list-style: none; margin: 0px;"><li style="float: left">[<a href="https://b.hatena.ne.jp/q/Chrome">Chrome</a>]</li><li style="float: left">[<a href="https://b.hatena.ne.jp/q/browser">browser</a>]</li><li style="float: left">[<a href="https://b.hatena.ne.jp/q/performance">performance</a>]</li><li style="float: left">[<a href="https://b.hatena.ne.jp/q/article">article</a>]</li></ul><br><p style="clear: left">CLSはユーザ操作でレイアウトの大きな変化が500ms間発生しないかをスコア化したメトリクス。 0,1以下が目標値。 レイアウトのガタッ、FOUT、画像読み込み、動的なコンテンツの追加など。 最初からサイズの規定しておくこと</p><a class="datetime" href="https://b.hatena.ne.jp/efcl/20200509#bookmark-4685260968221738498"><span class="datetime-body">2020/05/09 23:40</span></a></blockquote><script src="https://b.st-hatena.com/js/comment-widget.js" charset="utf-8" async></script>

このブックマークにはスターがありません。
最初のスターをつけてみよう！

Optimize Cumulative Layout Shift | Articles | web.dev

web.dev2020/05/05

Optimize Cumulative Layout Shift Stay organized with collections Save and categorize content based on your preferences. Cumulative Layout Shift (CLS) is one of the three Core Web Vitals metrics. It...

27 人がブックマーク・4 件のコメント

他のコメントを読む

＼コメントがサクサク読めるアプリです／

はてなブックマーク

Optimize Cumulative Layout Shift | Articles | web.dev

はてなブックマーク

公式Twitter

はてなのサービス