PerformanceServerTiming
Baseline
Weitgehend verfügbar
Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit März 2023 browserübergreifend verfügbar.
Hinweis: Diese Funktion ist in Web Workers verfügbar.
Sicherer Kontext: Diese Funktion ist nur in sicheren Kontexten (HTTPS) in einigen oder allen unterstützenden Browsern verfügbar.
Die PerformanceServerTiming-Schnittstelle stellt Servermetriken bereit, die mit der Antwort im HTTP-Header Server-Timing gesendet werden.
Der Zugriff auf diese Schnittstelle ist auf denselben Ursprung beschränkt. Mit dem Header Timing-Allow-Origin können Sie jedoch festlegen, welche Domains auf die Servermetriken zugreifen dürfen. Beachten Sie, dass diese Schnittstelle in einigen Browsern nur in sicheren Kontexten (HTTPS) verfügbar ist.
Instanzeigenschaften
PerformanceServerTiming.descriptionSchreibgeschützt-
Ein Zeichenfolgenwert mit der vom Server angegebenen Beschreibung der Metrik oder eine leere Zeichenfolge.
PerformanceServerTiming.durationSchreibgeschützt-
Eine Gleitkommazahl vom Typ
doublemit der vom Server angegebenen Dauer der Metrik oder dem Wert0.0. PerformanceServerTiming.nameSchreibgeschützt-
Ein Zeichenfolgenwert mit dem vom Server angegebenen Namen der Metrik.
Instanzmethoden
PerformanceServerTiming.toJSON()-
Gibt ein JSON-serialisierbares einfaches Objekt zurück, das das
PerformanceServerTiming-Objekt repräsentiert. Wird automatisch vonJSON.stringify()aufgerufen.
Beispiel
Angenommen, ein Server sendet den Header Server-Timing, beispielsweise ein Node.js-Server wie dieser:
const http = require("http");
function requestHandler(request, response) {
const headers = {
"Server-Timing": `
cache;desc="Cache Read";dur=23.2,
db;dur=53,
app;dur=47.2
`.replace(/\n/g, ""),
};
response.writeHead(200, headers);
response.write("");
return setTimeout(() => {
response.end();
}, 1000);
}
http.createServer(requestHandler).listen(3000).on("error", console.error);
Die PerformanceServerTiming-Einträge sind nun über die Eigenschaft PerformanceResourceTiming.serverTiming in JavaScript zugänglich und gehören zu navigation- und resource-Einträgen.
Das folgende Beispiel verwendet einen PerformanceObserver, der über neue navigation- und resource-Performance-Einträge informiert, sobald sie in der Performance-Timeline des Browsers erfasst werden. Verwenden Sie die Option buffered, um auf Einträge zuzugreifen, die vor der Erstellung des Observers erfasst wurden.
const observer = new PerformanceObserver((list) => {
list.getEntries().forEach((entry) => {
entry.serverTiming.forEach((serverEntry) => {
console.log(
`${serverEntry.name} (${serverEntry.description}) duration: ${serverEntry.duration}`,
);
// Logs "cache (Cache Read) duration: 23.2"
// Logs "db () duration: 53"
// Logs "app () duration: 47.2"
});
});
});
["navigation", "resource"].forEach((type) =>
observer.observe({ type, buffered: true }),
);
Das folgende Beispiel verwendet Performance.getEntriesByType(). Diese Methode zeigt nur die navigation- und resource-Performance-Einträge an, die zum Zeitpunkt des Aufrufs in der Performance-Timeline des Browsers vorhanden sind:
for (const entryType of ["navigation", "resource"]) {
for (const { name: url, serverTiming } of performance.getEntriesByType(
entryType,
)) {
if (serverTiming) {
for (const { name, description, duration } of serverTiming) {
console.log(`${name} (${description}) duration: ${duration}`);
// Logs "cache (Cache Read) duration: 23.2"
// Logs "db () duration: 53"
// Logs "app () duration: 47.2"
}
}
}
}
Spezifikationen
| Spezifikation |
|---|
| Server Timing # the-performanceservertiming-interface |