PerformanceResourceTiming: requestStart 属性

Baseline 已广泛支持

此功能已成熟，可跨多种设备和浏览器版本使用。自 2017 年 9 月以来，它已在浏览器中提供。

注意：此功能在 Web Workers 中可用。

requestStart 只读属性返回一个 timestamp，表示浏览器开始从服务器、缓存或本地资源请求资源的紧前时刻。如果传输连接失败并且浏览器重试请求，返回的值将是重试请求的开始时间。

requestStart 没有“结束”属性。要测量请求时间，请计算 responseStart - requestStart（参见下方的示例）。

值

requestStart 属性可以具有以下值

一个 DOMHighResTimeStamp，表示浏览器开始从服务器请求资源的紧前时刻。
如果资源是从缓存中即时检索的，则为 0。
如果资源是跨域请求且未使用 Timing-Allow-Origin HTTP 响应头，则返回 0。

当 firstInterimResponseStart 非零时，表示对于支持的浏览器，它应与 requestStart 的值相同。

当没有中间响应时，requestStart 与 finalResponseHeadersStart 相同，而 firstInterimResponseStart 为 0。

示例

测量请求时间

requestStart 和 responseStart 属性可用于测量请求花费的时间。

const request = entry.responseStart - entry.requestStart;

使用 PerformanceObserver 的示例，它会在浏览器性能时间线中记录新的 resource 性能条目时通知。使用 buffered 选项可以访问观察者创建之前的条目。

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

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

使用 Performance.getEntriesByType() 的示例，它只显示在调用此方法时浏览器性能时间线中存在的 resource 性能条目

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