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 |
浏览器兼容性
加载中…