PerformanceResourceTiming: firstInterimResponseStart-Eigenschaft

Die Eigenschaft firstInterimResponseStart kann die folgenden Werte haben:

• Ein DOMHighResTimeStamp unmittelbar nachdem der Browser die ersten vorläufigen Bytes der Antwort vom Server erhält.
• 0, wenn die Ressource keine vorläufige Antwort gesendet hat.
• 0, wenn die Ressource eine Cross-Origin-Anfrage ist und kein Timing-Allow-Origin HTTP-Response-Header verwendet wird.

Ein nicht-null-firstInterimResponseStart zeigt an, dass es denselben Wert haben sollte wie requestStart bei unterstützenden Browsern.

Die Eigenschaften firstInterimResponseStart und requestStart können verwendet werden, um zu messen, wie lange es dauert, bis der Browser eine vorläufige Antwort nach dem Senden der Anfrage erhält.

const request = entry.firstInterimResponseStart - entry.requestStart;

Im folgenden Beispiel wird ein PerformanceObserver verwendet, um über neue resource-Performance-Einträge zu benachrichtigen, sobald sie in der Performance-Zeitleiste des Browsers aufgezeichnet werden. Die buffered-Option wird verwendet, um Einträge vor der Erstellung des Observers zuzugreifen.

const observer = new PerformanceObserver((list) => {
  list.getEntries().forEach((entry) => {
    const request = entry.firstInterimResponseStart - entry.requestStart;
    if (request > 0) {
      console.log(`${entry.name}: Interim response time: ${request}ms`);
    }
  });
});

observer.observe({ type: "resource", buffered: true });

Das folgende Beispiel verwendet Performance.getEntriesByType(), das nur resource-Performance-Einträge anzeigt, die sich zum Zeitpunkt des Aufrufs der Methode in der Performance-Zeitleiste des Browsers befinden.

const resources = performance.getEntriesByType("resource");
resources.forEach((entry) => {
  const request = entry.firstInterimResponseStart - entry.requestStart;
  if (request > 0) {
    console.log(`${entry.name}: Interim response time: ${request}ms`);
  }
});

Wenn der Wert der Eigenschaft firstInterimResponseStart 0 ist, könnte die Ressource eine Cross-Origin-Anfrage sein. Um das Anzeigen von Timing-Informationen für Cross-Origin-Anfragen zu ermöglichen, muss der Timing-Allow-Origin HTTP-Response-Header gesetzt werden.

Zum Beispiel, um https://developer.mozilla.org zu erlauben, Timing-Ressourcen zu sehen, sollte die Cross-Origin-Resource senden:

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

• Timing-Allow-Origin
• finalResponseHeadersStart