伺服器計時
Server-Timing 是 Performance API 的一部分，它允許伺服器將請求-響應週期相關的指標傳達給使用者代理。您可以像處理所有其他 Performance API 指標一樣，收集此資訊並根據伺服器端指標採取行動。
傳送伺服器指標
Server-Timing HTTP 標頭用於展示任何後端伺服器時序指標。例如，您可能希望傳送資料庫讀/寫操作時間、CPU 時間和檔案系統訪問時間。
您可以傳送帶值或不帶值的指標。指標可以包含可選的描述。建議儘可能保持名稱、描述和資料簡短，以最小化 HTTP 開銷。
Server-Timing 標頭示例
// Single metric without value
Server-Timing: missedCache
// Single metric with value
Server-Timing: cpu;dur=2.4
// Single metric with description and value
Server-Timing: cache;desc="Cache Read";dur=23.2
// Two metrics with values
Server-Timing: db;dur=53, app;dur=47.2
// Server-Timing as trailer
Trailer: Server-Timing
--- response body ---
Server-Timing: total;dur=123.4
要計算實際的伺服器端指標，請查閱您的伺服器端 CMS、框架或程式語言的文件，瞭解如何在後端應用程式中測量效能。如果您的伺服器使用 Node.js，那麼效能測量 API 將非常類似於瀏覽器中的 Performance API。這是因為 Node.js 的效能模組是 W3C Web Performance API 的一個子集，幷包含用於 Node.js 特定的效能測量的額外 API。有關更多資訊，請參閱 Node.js 效能文件。
請注意，伺服器、客戶端和任何中間代理之間沒有時鐘同步。這意味著，如果您的伺服器傳送時間戳或 startTime，該值可能無法有意義地對映到客戶端時間軸的 startTime。
在計算出所需的指標後，伺服器需要在其響應中傳送 Server-Timing 標頭。有關如何在 Node.js 中傳送此標頭的示例，請參閱 Server-Timing 參考頁面。
檢索伺服器指標
伺服器時序指標通常會出現在瀏覽器的開發者工具中，但它們也作為 PerformanceServerTiming 效能條目儲存，您可以像訪問其他 效能資料一樣訪問它們。但是，沒有單獨的 "server-timing" 條目。PerformanceServerTiming 物件可以從 "navigation" 和 "resource" 效能條目中觀察到。您可以透過 PerformanceResourceTiming.serverTiming 屬性訪問伺服器指標，該屬性是 PerformanceServerTiming 物件的一個數組。
給定一個如下所示的 Server-Timing 標頭
Server-Timing: cache;desc="Cache Read";dur=23.2,db;dur=53,app;dur=47.2
使用以下程式碼，PerformanceObserver 可以在客戶端記錄這些條目
const observer = new PerformanceObserver((list) => {
list.getEntries().forEach((entry) => {
entry.serverTiming.forEach((serverEntry) => {
console.log(
`${serverEntry.name} (${serverEntry.description}) duration: ${serverEntry.duration}`,
);
// Logs "cache (Cache Read) duration: 23.2"
// Logs "db () duration: 53"
// Logs "app () duration: 47.2"
});
});
});
["navigation", "resource"].forEach((type) =>
observer.observe({ type, buffered: true }),
);
隱私和安全注意事項
Server-Timing 標頭可能會暴露潛在敏感的應用程式和基礎設施資訊。因此，您需要在伺服器端控制何時以及向誰返回這些指標。例如，您可以只向已透過身份驗證的使用者顯示指標，而對公眾不顯示任何內容。
PerformanceServerTiming 介面僅限於同源策略，但您可以使用 Timing-Allow-Origin 標頭來指定允許訪問伺服器指標的域名。另外，請注意，此介面在某些瀏覽器中僅在安全上下文 (HTTPS) 中可用。