Cloudflare Web Analyticsの使い方｜実際の表示速度を確かめる

自分のパソコンでは速いサイトでも、スマートフォンや別の地域では読み込みに時間がかかることがあります。Cloudflare Web Analyticsは、訪問者のブラウザーから集めた表示時間やCore Web Vitalsを確認する無料の解析機能です。Cloudflare Pagesに公開したサイトなら、管理画面から有効にする手順を紹介します。

手順1：Cloudflare Pagesで有効にする

1. 1Cloudflareダッシュボードでプロジェクトを選ぶ

   Cloudflareにログインし、「Workers & Pages」から対象のPagesプロジェクトを開きます。ここでは公開中のプロジェクトに計測を追加します。

2. 2MetricsからWeb Analyticsを有効にする

   プロジェクトの「Metrics」を開き、「Web Analytics」のEnableを選択します。Cloudflare Pagesでは、次のデプロイ時に計測用JavaScriptが自動で追加されます。DNS設定を変更する手順ではありません。

3. 3次のデプロイ後に公開サイトを確認する

   サイトをデプロイし、実際の公開URLを開きます。CloudflareのWeb Analytics一覧で対象サイトの表示が始まるか確認してください。公式案内では、データが表示されるまで数分かかる場合があります。

4. 4ページ速度の項目を開く

   対象サイトのダッシュボードで「Page load time」や「Core Web Vitals」を開きます。URLやブラウザーなどで絞り込み、遅いページ・端末に偏りがないか見ます。

Cloudflare Pages以外のサイトに設置する場合

Cloudflareをプロキシに使っていないサイトでも、Cloudflare Web Analyticsの「Add a site」からホスト名を登録し、表示されたJavaScript snippetをHTMLのbody終了タグ付近へ設置できます。CSP（Content Security Policy）を設定しているサイトでは、計測スクリプトの読み込み先が許可されているかも確認してください。Pagesのワンクリック設定と手動設置の手順を混ぜないようにします。

測定値を見て、次の修正を一つ決める

1. 1遅いページを開く

   サイト全体の平均だけでなく、ページURLで絞ります。商品一覧だけ遅いのか、記事だけ遅いのかを分けると、原因を探しやすくなります。

2. 2Core Web Vitalsのどの項目か見る

   LCPは主な内容の表示、INPは操作への反応、CLSは表示中のレイアウト移動の目安です。たとえば画像の表示でLCPが遅いなら、その画像の容量や読み込み方法を先に点検します。

3. 3修正を一つ行い、同じページを再確認

   画像圧縮や不要なスクリプトの削除など一つだけ変更し、数日後に同じURLの値を見比べます。訪問者数が少ないと値が安定しにくいため、数件の結果だけで断定しません。

ClaudeやCodexに相談して計測プログラムを作る場合、出来上がるのは自社の基準に合わせたコードや画面です。すぐ使える指標一覧や、ブラウザーごとの実測データが最初から集まっているわけではありません。データを保存する場所、アクセス権、異常時の通知、ブラウザー更新への対応を作り、維持する必要があります。Cloudflare Web Analyticsなら標準の速度指標をすぐ見られますが、独自の指標を自由に足す用途には向きません。

Search ConsoleやUmamiと混同しない