PerformanceResourceTiming: connectStart 属性

基线 广泛可用

此功能已十分成熟，并在许多设备和浏览器版本中运行良好。它从 2017 年 9 月.

报告反馈

值

connectStart 只读属性返回 时间戳，该时间戳在用户代理开始建立与服务器的连接以检索资源之前。

  • connectStart 属性可以具有以下值
  • 在浏览器开始建立与服务器的连接以检索资源之前立即返回一个 DOMHighResTimeStamp。
  • 如果资源是从缓存中立即检索的，则返回 0。

示例

如果资源是跨源请求且未使用 Timing-Allow-Origin HTTP 响应头，则返回 0。

测量 TCP 握手时间

connectStart 和 connectEnd 属性可用于测量 TCP 握手完成所需的时间。
const tcp = entry.connectEnd - entry.connectStart;

js

connectStart 和 connectEnd 属性可用于测量 TCP 握手完成所需的时间。
const observer = new PerformanceObserver((list) => {
  list.getEntries().forEach((entry) => {
    const tcp = entry.connectEnd - entry.connectStart;
    if (tcp > 0) {
      console.log(`${entry.name}: TCP handshake duration: ${tcp}ms`);
    }
  });
});

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

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

connectStart 和 connectEnd 属性可用于测量 TCP 握手完成所需的时间。
const resources = performance.getEntriesByType("resource");
resources.forEach((entry) => {
  const tcp = entry.connectEnd - entry.connectStart;
  if (tcp > 0) {
    console.log(`${entry.name}: TCP handshake duration: ${tcp}ms`);
  }
});

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

跨源计时信息

如果 connectStart 属性的值为 0，则资源可能是跨源请求。要允许查看跨源计时信息，需要设置 Timing-Allow-Origin HTTP 响应头。

例如，要允许 https://mdn.org.cn 查看计时资源，跨源资源应发送
Timing-Allow-Origin: https://mdn.org.cn

规范

http
规范
# 资源计时

浏览器兼容性

dom-performanceresourcetiming-connectstart

另请参阅