ラベル「WebVitals」の付いた投稿を表示しています。

Cumulative Layout Shift (CLS) をJavaScriptで検出する

投稿日 2021/01/28 更新日 2021/03/26
thumbnail
はじめに これまで、DevToolsのPerformanceタブからレイアウトシフトを確認していました。ですが、これだと目視する必要がある上に自動化できません。調べてみると、Layout Instability APIが見つかったのでそれの覚書です。 ※PageSpeed Ins...

ウェブに関する主な指標(LCP, FID, CLS)について

投稿日 2020/07/12 更新日 2021/03/26
thumbnail
2020年5月末に PageSpeed Insights の表示が更新されて「最大コンテンツの描画(LCP)」「初回入力遅延(FID)」「累積レイアウト変更(CLS)」を ウェブに関する主な指標 として表示するようになりました。勉強がてらに他の関連の指標も含めてユーザーエクスペリ...

FID(First Input Delay)とはなにか?

投稿日 2020/02/17 更新日 2021/03/26
thumbnail
はじめに 次の資料にFID(First Input Delay)の詳しい説明があります。ただし、この資料を読んでも筆者には、FIDが何を意味するのか正確にはわかりませんでした。そこで、記事内で紹介されているpolyfillコードやPageSpeedInsightsの表示するFID...