PerformanceObserver:observe() 方法
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2020年1月.
备注: 此特性在 Web Worker 中可用。
PerformanceObserver
的 observe()
方法用于观察传入的参数中指定的性能条目类型的集合。
请参阅 PerformanceEntry.entryType
了解条目类型列表,并参阅 PerformanceObserver.supportedEntryTypes
了解用户代理支持的条目类型列表。
当记录一个指定类型的性能条目时,在创建 PerformanceObserver
时设置的回调函数会被调用。
语法
observe(options)
参数
options
-
具有以下可能成员的对象:
buffered
-
一个布尔标志,指示缓冲条目是否应排队到观察器的缓冲区中。必须只与
type
选项一起使用。 durationThreshold
-
DOMHighResTimeStamp
定义PerformanceEventTiming
条目的阈值。默认值为 104 毫秒,四舍五入到最接近的 8 毫秒。最低阈值为 16 毫秒。不可与entryTypes
选项同时使用。 entryTypes
-
字符串数组,每个字符串指定一个要观察的性能条目类型。不能与
type
、buffered
或durationThreshold
选项一起使用。 请参阅PerformanceEntry.entryType
以获取有效的性能条目类型名称列表。无法识别的类型将被忽略,但浏览器可能会向控制台输出警告消息以帮助开发者调试代码。如果没有找到有效类型,则observe()
不起作用。 type
-
一个字符串,用于指定一种需要观察的性能条目类型。不能与
entryTypes
选项一起使用。
返回值
无(undefined
)。
示例
>观察多种性能条目类型
此示例创建了一个 PerformanceObserver
,并监视 observe()
方法中 entryTypes
选项指定的 "mark"
和 "measure"
条目类型。
const observer = new PerformanceObserver((list, obj) => {
list.getEntries().forEach((entry) => {
// 处理“mark”和“measure”事件
});
});
observer.observe({ entryTypes: ["mark", "measure"] });
观察单个性能条目类型
以下示例使用 buffered
和 type
配置项检索缓冲事件并订阅资源加载计时事件(PerformanceResourceTiming
)的最新条目。每当你需要配置观察器以使用 buffered
或 durationThreshold
选项时,应使用 type
而不是 entryType
。否则无法同时收集多种性能条目类型。
const observer = new PerformanceObserver((list, obj) => {
list.getEntries().forEach((entry) => {
// 处理“resource”事件
});
});
observer.observe({ type: "resource", buffered: true });
规范
Specification |
---|
Performance Timeline> # dom-performanceobserver-observe> |
浏览器兼容性
Loading…