我们的志愿者还没有将这篇文章翻译为 中文 (简体)。加入我们帮助完成翻译！
您也可以阅读此文章的English (US)版。
This is an experimental technology
Because this technology's specification has not stabilized, check the compatibility table for usage in various browsers. Also note that the syntax and behavior of an experimental technology is subject to change in future versions of browsers as the specification changes.
PerformanceFrameTiming is an abstract interface that provides frame timing data about the browser's event loop. A frame represents the amount of work a browser does in one event loop such as processing DOM events, resizing, scrolling, rendering, CSS animations, etc.. A frame rate 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="https://developer.mozilla.org/en-US/docs/Web/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;}
Properties
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 document's address.
PerformanceEntry.startTime- Returns the
timestampwhen the frame was started. PerformanceEntry.duration- Returns a
timestampindicating the difference between thestartTimes of two successive frames.
Methods
This interface has no methods.
Example
See the example in Using the Frame Timing API.
Specifications
| Specification | Status | Comment |
|---|---|---|
| Frame Timing The definition of 'PerformanceFrameTiming' in that specification. |
Editor's Draft | Initial definition. |
Browser compatibility
| Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
|---|---|---|---|---|---|
| Basic Support | No support[1] | No support[2] | No support | No support | No support |
| Feature | Android Webview | Chrome for Android | Firefox Mobile (Gecko) | Firefox OS | IE Phone | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|---|---|
| Basic Support | No support[1] | No support[1] | No support | No support | No support | No support | No support |
[1] See Chrome bug 120796.
[2] See bug 1158032.