PerformanceResourceTiming: responseEnd 属性
注意：此功能在 Web Workers 中可用。
只读属性 responseEnd 返回一个 timestamp，该时间戳在浏览器接收到资源的最后一个字节之后立即出现，或者在传输连接关闭之前立即出现，以先发生者为准。
与许多其他 PerformanceResourceTiming 属性不同，responseEnd 属性可用于跨域请求，而无需 Timing-Allow-Origin HTTP 响应头。
值
一个 DOMHighResTimeStamp，该时间戳在浏览器接收到资源的最后一个字节之后立即出现，或者在传输连接关闭之前立即出现，以先发生者为准。
示例
衡量获取时间（不含重定向）
responseEnd 和 fetchStart 属性可用于衡量获取最终资源（不含重定向）的总时间。如果您想包含重定向，则获取总时间在 duration 属性中提供。
js
const timeToFetch = entry.responseEnd - entry.fetchStart;
使用 PerformanceObserver 的示例，它会在浏览器性能时间线中记录新的 resource 性能条目时通知。使用 buffered 选项可以访问观察者创建之前的条目。
js
const observer = new PerformanceObserver((list) => {
list.getEntries().forEach((entry) => {
const timeToFetch = entry.responseEnd - entry.fetchStart;
if (timeToFetch > 0) {
console.log(`${entry.name}: Time to fetch: ${timeToFetch}ms`);
}
});
});
observer.observe({ type: "resource", buffered: true });
使用 Performance.getEntriesByType() 的示例，它只显示在调用此方法时浏览器性能时间线中存在的 resource 性能条目
js
const resources = performance.getEntriesByType("resource");
resources.forEach((entry) => {
const timeToFetch = entry.responseEnd - entry.fetchStart;
if (timeToFetch > 0) {
console.log(`${entry.name}: Time to fetch: ${timeToFetch}ms`);
}
});
规范
| 规范 |
|---|
| 资源时序 # dom-performanceresourcetiming-responseend |
浏览器兼容性
加载中…