SCALE — Build Lab
ホーム / コツ / Core Web Vitals 計測 (LCP/FID/CLS)
TIER 1 · パフォーマンス

Core Web Vitals 計測 (LCP/FID/CLS)

Webページの体感速度3指標（LCP/FID/CLS）を本番環境で実測。Google検索順位にも直結。

EFFECT

体感速度の数値化で改善優先度が明確に。

KEY POINTS（6）
  • LCP（Largest Contentful Paint）2.5秒以内が良好
  • FID（First Input Delay）100ms以内
  • CLS（Cumulative Layout Shift）0.1以下
  • web-vitals npm でリアルユーザー計測
  • Google Analytics / 自前KVに送信
  • 改善ループ: 計測 → 仮説 → 改善 → 計測
TARGET READERS
フロントエンドパフォーマンスエンジニアSEO担当

Core Web Vitals 計測 (LCP/FID/CLS)

:LiTarget: 概要

Webページの体感速度3指標（LCP/FID/CLS）を本番環境で実測。Google検索順位にも直結。

:LiKey: 要点

  • LCP（Largest Contentful Paint）2.5秒以内が良好
  • FID（First Input Delay）100ms以内
  • CLS（Cumulative Layout Shift）0.1以下
  • web-vitals npm でリアルユーザー計測
  • Google Analytics / 自前KVに送信
  • 改善ループ: 計測 → 仮説 → 改善 → 計測

:LiUsers: 対象読者

  • フロントエンド
  • パフォーマンスエンジニア
  • SEO担当

:LiTrendingUp: 効果

体感速度の数値化で改善優先度が明確に。