PerformanceFrameTiming 是 abstract interface that provides frame timing data about the browser's event loop. A frame 表示浏览器所做的工作量在 one event loop such as processing DOM events, resizing, scrolling, rendering, CSS animations, etc.. A 帧速率 of 60fps (frames per second) for a 60Hz refresh rate is the target for a good responsive user experience. This means the browser should process a frame in about 16.7ms.

An application can register a PerformanceObserver for " frame " performance entry types and the observer can retrieve data about the duration of each frame event. This information can be used to help identify areas that take too long to provide a good user experience.

  <div id="interfaceDiagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveAspectRatio="xMinYMin meet"><a xlink:href="../API/PerformanceFrameTiming" target="_top"><rect x="1" y="1" width="220" height="50" fill="#F4F7F8" stroke="#D4DDE4" stroke-width="2px" /><text  x="111" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">PerformanceFrameTiming</text></a></svg></div>
					

  a:hover text { fill: #0095DD; pointer-events: all;}
					

特性

This interface has no properties but it extends the following PerformanceEntry properties (for " frame " performance entry types ) by qualifying and constraining the properties as follows:

PerformanceEntry.entryType

Returns " frame ".

PerformanceEntry.name

Returns the 文档的地址 .

PerformanceEntry.startTime

返回 timestamp when the frame was started.

PerformanceEntry.duration

返回 timestamp indicating the difference between the startTime s of two successive frames.

方法

This interface has no methods.

范例

See the example in 使用帧计时 API .

规范

规范	状态	注释
Frame Timing The definition of 'PerformanceFrameTiming' in that specification.	草案	初始定义。

浏览器兼容性

The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request. 更新 GitHub 上的兼容性数据

	桌面						移动
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome for Android	Firefox for Android	Opera for Android	Safari on iOS	Samsung Internet
PerformanceFrameTiming	Chrome 不支持 No 注意事项 No 注意事项 见 Chrome bug 120796	Edge 不支持 No 注意事项 No 注意事项 见 Chrome bug 120796	Firefox 不支持 No 注意事项 No 注意事项 见 bug 1158032	IE 不支持 No	Opera 不支持 No	Safari 不支持 No	WebView Android 不支持 No 注意事项 No 注意事项 见 Chrome bug 120796	Chrome Android 不支持 No 注意事项 No 注意事项 见 Chrome bug 120796	Firefox Android 不支持 No	Opera Android 不支持 No	Safari iOS 不支持 No	Samsung Internet Android 不支持 No 注意事项 No 注意事项 见 Chrome bug 120796

图例

不支持

不支持

实验。期望将来行为有所改变。

实验。期望将来行为有所改变。

见实现注意事项。

另请参阅

• PerformanceObserver
• 帧速率 (Firefox 性能工具)
• Frame Timing (Overview)
• 使用帧计时 API

元数据

• 最后修改： Jan 29, 2020