Veröffentlicht am 7. Februar 2023, zuletzt aktualisiert am 11. April 2025
In diesem Leitfaden wird der Chrome UX Report (CrUX) History API Endpunkt vorgestellt, der Zeitreihen mit Web-Leistungsdaten bereitstellt. Diese Daten werden wöchentlich aktualisiert und enthalten Verlaufsdaten für etwa sechs Monate mit 40 Datenpunkten im Abstand von einer Woche.
In Kombination mit den täglichen Updates vom ursprünglichen CrUX API Endpunkt können Sie jetzt sowohl die neuesten Daten als auch die bisherigen Daten schnell einsehen. Dadurch ist dies ein leistungsstarkes Tool, um Änderungen an Webseiten im Zeitverlauf zu beobachten.
API auf dieser Seite testen
Tägliche CrUX API abfragen
Wie in einem früheren Artikel zur CrUX API beschrieben, können Sie so einen Snapshot der Felddaten für einen bestimmten Ursprung abrufen:
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 }
}
}
}
Dieser Snapshot enthält Histogrammdichtewerte und Perzentilwerte für einen bestimmten 28-Tage-Erfassungszeitraum, in diesem Fall vom 27. Dezember 2022 bis zum 23. Januar 2023.
CrUX History API abfragen
Um den Verlaufsendpunkt aufzurufen, ändern Sie queryRecord in der URL im curl-Befehl in queryHistoryRecord. Sie können denselben
CrUX API-Schlüssel wie für den vorherigen Aufruf verwenden.
collectionPeriodCount gibt die Anzahl der zurückzugebenden Zeitreiheneinträge an. Der Höchstwert ist 40. Wenn nichts angegeben ist, wird standardmäßig 25 verwendet.
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}'
Die allgemeine Form einer Antwort ist ähnlich, aber es gibt viel mehr Daten. Anstelle eines einzelnen Datenpunkts gibt es jetzt Zeitreihen für die Felder mit dem 75. Perzentil (p75) und den Histogrammdichtewerten.
{
"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": { "year": 2022, "month": 7, "day": 24 },
"lastDate": { "year": 2022, "month": 8, "day": 20 }
}, {
"firstDate": { "year": 2022, "month": 7, "day": 31 },
"lastDate": { "year": 2022, "month": 8, "day": 27 }
}, {
"firstDate": { "year": 2022, "month": 8, "day": 7 },
"lastDate": { "year": 2022, "month": 9, "day": 3 }
}, {
"firstDate": { "year": 2022, "month": 8, "day": 14 },
"lastDate": { "year": 2022, "month": 9, "day": 10 }
}
]
}
}
In diesem Beispiel ist die densities-Zeitreihe für den Bucket von 0 bis 2.500 ms des
Largest Contentful Paint (LCP)-Messwerts
[0.9190, 0.9203, 0.9194, 0.9195, 0.9183, 0.9187].. Jede dieser Dichten wurde
während des entsprechenden collectionPeriods-Eintrags beobachtet. Die fünfte Dichte, 0,9183, war beispielsweise die Dichte für den fünften Erfassungszeitraum, der am 3. September 2022 endete, und 0,9187 war die Dichte im Zeitraum, der in der Woche danach endete.
Mit anderen Worten: Bei der Interpretation der letzten Zeitreiheneinträge im Beispiel für web.dev wurde festgestellt, dass vom 14. August 2022 bis zum 10. September 2022 91,87% der Seitenladevorgänge LCP-Werte unter 2.500 ms, 5,27% Werte zwischen 2.500 ms und 4.000 ms und 2,85% Werte über 4.000 ms hatten.
Ebenso gibt es eine Zeitreihe für die p75-Werte: Der LCP-p75 für den Zeitraum vom 14. August 2022 bis zum 10. September 2022 war 1377. Das bedeutet, dass in diesem Erfassungszeitraum 75% der Nutzererfahrungen einen LCP-Wert von weniger als 1.377 ms und 25% einen LCP-Wert von mehr als 1.377 ms hatten.
Im Beispiel werden nur sechs Zeitreiheneinträge und Erfassungszeiträume aufgeführt.
Antworten von der API enthalten standardmäßig 25 Zeitreiheneinträge und maximal
40, wenn "collectionPeriodCount": 40 in der Anfrage angegeben ist. Da die
Enddaten für jeden dieser Erfassungszeiträume Samstage sind, die 7 Tage
auseinanderliegen, deckt "collectionPeriodCount": 40 10 Monate ab.
In jeder Antwort ist die Länge der Zeitreihe für die Histogramm-Bucket-Dichten und für p75-Werte genau gleich der Länge des Arrays im Feld collectionPeriods. Es gibt eine Eins-zu-eins-Entsprechung basierend auf dem Index in diesen Arrays.
Daten auf Seitenebene abfragen
Neben Daten auf Ursprungsebene ermöglicht die CrUX History API auch den Zugriff auf Verlaufsdaten auf Seitenebene. Die Daten auf Ursprungsebene waren bereits über das CrUX-Dataset in BigQueryverfügbar. Die Verlaufsdaten auf Seitenebene waren jedoch nur verfügbar, wenn Websites die Daten selbst erfasst und gespeichert haben. Die neue API ermöglicht jetzt den Zugriff auf diese Verlaufsdaten auf Seitenebene.
Die Daten auf Seitenebene können auf dieselbe Weise abgefragt werden, aber verwenden Sie in der Nutzlast url anstelle von origin:
API_KEY="[YOUR_API_KEY]"
curl "https://chromeuxreport.googleapis.com/v1/records:queryHistoryRecord?key=$API_KEY" \
--header 'Content-Type: application/json' \
--data '{"url": "https://web.dev/blog/"}'
Für Verlaufsdaten auf Seiten- und Ursprungsebene gelten
dieselben Berechtigungsvoraussetzungen wie für die
übrigen CrUX-Daten. Daher sind für Seiten möglicherweise keine vollständigen
Verlaufsdaten verfügbar. In diesen Fällen werden die "fehlenden" Daten durch "NaN" für die
histogramTimeseries Dichten und null für die percentilesTimeseries dargestellt. Der Grund für den Unterschied ist, dass die Histogrammdichten immer Zahlen sind, während die Perzentile Zahlen oder Strings sein können (CLS verwendet Strings, auch wenn sie wie Zahlen aussehen).
Die Daten visualisieren
Die einfachste Möglichkeit, die Daten zu visualisieren, ist durch CrUX Vis, ein Tool, das speziell entwickelt wurde, um die Leistungsfähigkeit der CrUX History API zu demonstrieren. Weitere Informationen finden Sie in der CrUX Vis-Dokumentation.
Wenn Sie ähnliche Diagramme selbst erstellen möchten, haben wir ein Beispiel Colab erstellt. Mit Colab oder „Colaboratory“ können Sie Python-Code in Ihrem Browser schreiben und ausführen. Im CrUX History API Colab (Quelle) werden mit Python Aufrufe an die API ausgeführt und die Daten grafisch dargestellt.
Mit diesem Colab können Sie p75-Diagramme und Diagramme mit drei Buckets erstellen, Daten in Tabellenform abrufen und das Anfrage-Antwort-Paar für die CrUX API aufrufen. Dazu müssen Sie nur ein kurzes Formular ausfüllen. Sie müssen kein Programmierer sein, um dieses Tool zu verwenden. Sie können sich aber den Python-Code ansehen und ihn ändern, um etwas Besonderes zu erstellen.
Dies ist nur ein Beispiel für die Verwendung dieser neuen API. Da es sich um einen JSON-basierten HTTP-Endpunkt handelt, kann die API mit jeder Technologie abgefragt werden.
Fazit
Vor der Einführung des CrUX History API-Endpunkts waren Websiteinhaber in Bezug auf die Verlaufsdaten, die sie aus CrUX abrufen konnten, eingeschränkt. Monatliche Daten auf Ursprungsebene waren über BigQuery verfügbar, wöchentliche Daten und Verlaufsdaten auf Seitenebene jedoch nicht. Websiteinhaber konnten diese Daten selbst mit der täglichen API erfassen, aber der Bedarf dafür wurde oft erst nach einer Regression der Messwerte festgestellt.
Mit der Einführung dieser CrUX History API sollen Websiteinhaber ein besseres Verständnis für die sich ändernden Messwerte ihrer Website erhalten und sie als Diagnosetool bei Problemen verwenden können. Wenn Sie die neue API verwenden, können Sie Feedback in der Google-Gruppe Chrome UX Report (Discussions) geben.