PerformanceEntry: name 屬性
注意：此功能在 Web Workers 中可用。
PerformanceEntry 介面中只讀的 name 屬性是一個字串，用於表示效能條目的名稱。它充當一個識別符號，但不必是唯一的。其值取決於子類。
值
一個字串。其值取決於 PerformanceEntry 物件的子類，如下表所示。
| 子類 | 值 |
|---|---|
LargestContentfulPaint |
始終返回空字串。 |
LayoutShift |
始終返回 "layout-shift"。 |
PerformanceElementTiming |
以下字串之一
|
PerformanceEventTiming |
關聯事件的型別。 |
PerformanceLongTaskTiming |
以下字串之一
|
PerformanceMark |
呼叫 performance.mark() 建立標記時使用的名稱。 |
PerformanceMeasure |
呼叫 performance.measure() 建立度量時使用的名稱。 |
PerformanceNavigationTiming |
請求資源的解析 URL。請注意，這會省略任何 文字片段或其他片段指令。即使請求被重定向，該值也不會改變。 |
PerformancePaintTiming |
以下字串之一
|
PerformanceResourceTiming |
請求資源的解析 URL。即使請求被重定向，該值也不會改變。 |
TaskAttributionTiming |
始終返回 "unknown"。 |
VisibilityStateEntry |
以下字串之一
|
示例
按名稱過濾效能條目
當 PerformanceEntry 是 PerformanceResourceTiming 物件時，name 屬性引用請求資源的解析 URL。在這種情況下，name 屬性可用於過濾特定資源，例如所有 SVG 影像。
js
// Log durations of SVG resources
performance.getEntriesByType("resource").forEach((entry) => {
if (entry.name.endsWith(".svg")) {
console.log(`${entry.name}'s duration: ${entry.duration}`);
}
});
按名稱獲取效能條目
Performance 和 PerformanceObserver 都提供了可以直接按名稱獲取效能條目的方法。你並不一定需要 name 屬性來實現這一點，而是可以使用 Performance.getEntriesByName() 或 PerformanceObserverEntryList.getEntriesByName()。
js
// Log all marks named "debug-marks" at this point in time
const debugMarks = performance.getEntriesByName("debug-mark", "mark");
debugMarks.forEach((entry) => {
console.log(`${entry.name}'s startTime: ${entry.startTime}`);
});
// PerformanceObserver version
// Log all marks named "debug-marks" when they happen
function perfObserver(list, observer) {
list.getEntriesByName("debug-mark", "mark").forEach((entry) => {
console.log(`${entry.name}'s startTime: ${entry.startTime}`);
});
}
const observer = new PerformanceObserver(perfObserver);
observer.observe({ entryTypes: ["measure", "mark"] });
規範
| 規範 |
|---|
| 效能時間線 # dom-performanceentry-name |
瀏覽器相容性
載入中…