PerformanceResourceTiming: serverTiming-Eigenschaft

Ein Array von PerformanceServerTiming-Einträgen.

Sie können einen PerformanceObserver verwenden, um nach PerformanceServerTiming-Einträgen zu suchen. Die Dauer jedes Server-Eintrags wird in der Konsole protokolliert.

Beispiel eines PerformanceObserver, der benachrichtigt, wenn neue resource-Performance-Einträge in der Performance-Zeitleiste des Browsers aufgezeichnet werden. Verwenden Sie die buffered-Option, um auf Einträge zuzugreifen, die vor der Erstellung des Observers aufgetreten sind.

const observer = new PerformanceObserver((list) => {
  list.getEntries().forEach((entry) => {
    entry.serverTiming.forEach((serverEntry) => {
      console.log(`${serverEntry.name} duration: ${serverEntry.duration}`);
    });
  });
});

["navigation", "resource"].forEach((type) =>
  observer.observe({ type, buffered: true }),
);

Beispiel unter Verwendung von Performance.getEntriesByType(), das nur resource-Performance-Einträge anzeigt, die zum Zeitpunkt des Aufrufs dieser Methode in der Performance-Zeitleiste des Browsers vorhanden sind:

for (const entryType of ["navigation", "resource"]) {
  for (const { name: url, serverTiming } of performance.getEntriesByType(
    entryType,
  )) {
    if (serverTiming) {
      for (const { name, duration } of serverTiming) {
        console.log(`${url}: ${name} duration: ${duration}`);
      }
    }
  }
}

Der Zugriff auf Server-Timing-Informationen ist auf die gleiche Herkunft beschränkt. Um Timing-Informationen von anderen Ursprüngen freizugeben, muss der Timing-Allow-Origin-HTTP-Antwort-Header gesetzt werden.

Zum Beispiel, um https://developer.mozilla.org zu erlauben, Server-Timing-Informationen einzusehen, sollte die Ressource von einem anderen Ursprung senden:

Timing-Allow-Origin: https://developer.mozilla.org

• PerformanceServerTiming
• Server-Timing