PerformanceLongAnimationFrameTiming: toJSON() method
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
The toJSON() method of the PerformanceLongAnimationFrameTiming interface is a serializer; it returns a JSON representation of the PerformanceLongAnimationFrameTiming object.
Syntax
toJSON()
Parameters
None.
Return value
A JSON object that is the serialization of the PerformanceLongAnimationFrameTiming object.
Examples
Using the toJSON method
In this example, calling entry.toJSON() returns a JSON representation of the PerformanceLongAnimationFrameTiming object.
const observer = new PerformanceObserver((list) => {
list.getEntries().forEach((entry) => {
console.log(entry.toJSON());
});
});
observer.observe({ type: "long-animation-frame", buffered: true });
This would log an object like so:
({
blockingDuration: 0,
duration: 60,
entryType: "long-animation-frame",
firstUIEventTimestamp: 11801.099999999627,
name: "long-animation-frame",
renderStart: 11858.800000000745,
scripts: [
{
duration: 45,
entryType: "script",
executionStart: 11803.199999999255,
forcedStyleAndLayoutDuration: 0,
invoker: "DOMWindow.onclick",
invokerType: "event-listener",
name: "script",
pauseDuration: 0,
sourceURL: "https://web.dev/js/index-ffde4443.js",
sourceFunctionName: "myClickHandler",
sourceCharPosition: 17796,
startTime: 11803.199999999255,
window: {
// …Window object…
},
windowAttribution: "self",
},
],
startTime: 11802.400000000373,
styleAndLayoutStart: 11858.800000000745,
});
To get a JSON string, you can use JSON.stringify(entry) directly; it will call toJSON() automatically.
Specifications
| Specification |
|---|
| Long Animation Frames API # dom-performancelonganimationframetiming-tojson |
Browser compatibility
Loading…