PerformanceResourceTiming: serverTiming property
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2023.
Note: This feature is available in Web Workers.
Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.
Thuộc tính chỉ đọc serverTiming trả về một mảng các entry PerformanceServerTiming chứa các chỉ số server timing.
Các chỉ số server timing yêu cầu máy chủ gửi tiêu đề Server-Timing. Ví dụ:
Server-Timing: cache;desc="Cache Read";dur=23.2
Các entry serverTiming có thể nằm trên các entry navigation và resource.
Giá trị
Một mảng các entry PerformanceServerTiming.
Ví dụ
Ghi nhật ký các server timing entry
Bạn có thể dùng PerformanceObserver để theo dõi các entry PerformanceServerTiming. Duration của từng server entry sẽ được ghi vào console.
Ví dụ dùng PerformanceObserver, thông báo các performance entry resource mới khi chúng được ghi trong performance timeline của trình duyệt. Dùng tùy chọn buffered để truy cập các entry từ trước khi observer được tạo.
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 }),
);
Ví dụ dùng Performance.getEntriesByType(), chỉ hiển thị các performance entry resource đang có trong performance timeline tại thời điểm bạn gọi phương thức này:
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}`);
}
}
}
}
Thông tin server timing cross-origin
Quyền truy cập thông tin server timing bị giới hạn trong cùng origin. Để hiển thị thông tin timing cross-origin, cần đặt tiêu đề phản hồi HTTP Timing-Allow-Origin.
Ví dụ, để cho phép https://mdn.go-mizu.dev xem thông tin server timing, tài nguyên cross-origin nên gửi:
Timing-Allow-Origin: https://mdn.go-mizu.dev
Thông số kỹ thuật
| Specification |
|---|
| Server Timing # servertiming-attribute |