CrUX History API の使用方法

Johannes Henkel
Johannes Henkel
X GitHub Mastodon
Jasmine Yan
Jasmine Yan
GitHub
Barry Pollard

公開日: 2023 年 2 月 7 日、最終更新日: 2025 年 4 月 11 日

このガイドでは、ウェブ パフォーマンス データの時系列を提供する Chrome ユーザー エクスペリエンス レポート（CrUX）History API エンドポイントについて説明します。このデータは毎週更新され、約 6 か月分の履歴（40 個のデータポイントが 1 週間ごとに配置）を確認できます。

元の CrUX API エンドポイントからの毎日の更新と組み合わせて使用すると、最新のデータと過去のデータがすぐにわかるため、ウェブページの経時的な変化を確認する強力なツールとなります。

このページの API を試す

試してみる

日次 CrUX API に対してクエリを実行する

CrUX API に関する以前の記事で説明したように、特定オリジンのフィールド データのスナップショットは次のように取得できます。

API_KEY="[YOUR_API_KEY]"
curl "https://chromeuxreport.googleapis.com/v1/records:queryRecord?key=$API_KEY" --header 'Content-Type: application/json' --data '{"origin": "https://web.dev"}'

{
  "record": {
    "key": {
      "origin": "https://web.dev"
    },
    "metrics": {
      "largest_contentful_paint": {
        "histogram": [{
          "start": 0, "end": 2500, "density": 0.9192
        }, {
          "start": 2500, "end": 4000, "density": 0.0513
        }, {
          "start": 4000, "density": 0.0294
        }],
        "percentiles": {
          "p75": 1303
        }
      }
      // ...
    },
    "collectionPeriod": {
      "firstDate": { "year": 2022, "month": 12, "day": 27 },
      "lastDate": { "year": 2023, "month": 1, "day": 23 }
    }
  }
}

このスナップショットには、特定の 28 日間の収集期間（この場合は 2022 年 12 月 27 日から 2023 年 1 月 23 日まで）のヒストグラム密度値とパーセンタイル値が含まれています。

CrUX History API のクエリを実行する

履歴エンドポイントを呼び出すには、curl コマンドで URL の queryRecord を queryHistoryRecord に変更します。前の呼び出しと同じ CrUX API キーを使用しても問題ありません。collectionPeriodCount は、返される時系列エントリの数を指定します。最大値は 40 です。指定しない場合、デフォルトは 25 です。

API_KEY="[YOUR_API_KEY]"
curl "https://chromeuxreport.googleapis.com/v1/records:queryHistoryRecord?key=$API_KEY" \
 --header 'Content-Type: application/json' \
 --data '{"origin": "https://web.dev", "collectionPeriodCount": 40}'

レスポンスの全体的な形状は似ていますが、データが大幅に増えています。単一のデータポイントではなく、75 パーセンタイル（p75）とヒストグラム密度値を含むフィールドの時系列が表示されるようになりました。

{
  "record": {
    "key": {
      "origin": "https://web.dev"
    },
    "metrics": {
      "largest_contentful_paint": {
        "histogramTimeseries": [{
            "start": 0, "end": 2500, "densities": [
              0.9190, 0.9203, 0.9194, 0.9195, 0.9183, 0.9187
            ]
          }, {
            "start": 2500, "end": 4000, "densities": [
              0.0521, 0.0513, 0.0518, 0.0518, 0.0526, 0.0527
            ]
          },  {
            "start": 4000, "densities": [
              0.0288, 0.0282, 0.0286, 0.0285, 0.0290, 0.0285
            ]
          }
        ],
        "percentilesTimeseries": {
          "p75s": [
            1362, 1352, 1344, 1356, 1366, 1377
          ]
        }
      }
      // ...
    },
    "collectionPeriods": [{
        "firstDate": { "year": 2022, "month": 7, "day": 10 },
        "lastDate": { "year": 2022, "month": 8, "day": 6 }
      }, {
        "firstDate": { "year": 2022, "month": 7, "day": 17 },
        "lastDate": { "year": 2022, "month": 8, "day": 13 }
      }, {
        "firstDate": {