PerformanceNavigationTiming: type 屬性
只讀屬性 type 返回導航的型別。
您可以使用此屬性對導航計時資料進行分類，因為每種型別都有不同的效能特徵。使用者在網站上前後導航可能比首次導航或提交表單等使用者體驗更快。使用者往返於網站時，體驗可能比首次訪問或提交表單的使用者更快。
例如，如果您的網站頻繁提供新內容，您可能希望使用 Fetch API 或類似方法重新整理該內容，並避免使用者始終需要重新載入整個頁面。"reload" 型別可以幫助您找到經常重新載入的頁面。
值
type 屬性可以具有以下值：
-
透過單擊連結、在瀏覽器位址列中輸入 URL、提交表單，或透過除下面列出的
reload和back_forward以外的指令碼操作啟動的導航。 "reload"-
透過瀏覽器的重新載入操作、
location.reload()或 Pragma 指令（如<meta http-equiv="refresh" content="300">）進行的導航。 "back_forward"-
透過瀏覽器的歷史記錄遍歷操作進行的導航。
示例
記錄重新載入導航
可以使用 type 屬性來檢查導航是否為 reload 型別。您可以將這些 reload 條目收集到伺服器端端點，以確定您網站的哪些頁面重新載入的次數最多，或者收集所有導航型別並確定例如有多少百分比的使用者進行後退和前進導航。
使用 PerformanceObserver 的示例，它會在瀏覽器效能時間線中記錄新的 navigation 效能條目時通知您。使用 buffered 選項可以訪問觀察者建立之前的條目。
js
const observer = new PerformanceObserver((list) => {
list.getEntries().forEach((entry) => {
if (entry.type === "reload") {
console.log(`${entry.name} was reloaded!`);
console.log(entry);
}
});
});
observer.observe({ type: "navigation", buffered: true });
使用 Performance.getEntriesByType() 的示例，它僅顯示在呼叫方法時瀏覽器效能時間線中存在的 navigation 效能條目。
js
const entries = performance.getEntriesByType("navigation");
entries.forEach((entry) => {
if (entry.type === "reload") {
console.log(`${entry.name} was reloaded!`);
console.log(entry);
}
});
規範
| 規範 |
|---|
| 導航計時 Level 2 # dom-performancenavigationtiming-type |
瀏覽器相容性
載入中…