LargestContentfulPaint: toJSON() method
Baseline 2025
Newly available
Since December 2025, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.
The toJSON() method of the LargestContentfulPaint interface returns a JSON-serializable plain object representing the LargestContentfulPaint object.
The method is automatically called by JSON.stringify() when a LargestContentfulPaint object is encountered during JSON serialization.
Syntax
toJSON()
Parameters
None.
Return value
A JSON-serializable plain object containing the following properties:
nameentryTypestartTimedurationnavigationIdpaintTimepresentationTimesizerenderTimeloadTimeidurl
Each property's value is copied as-is.
The returned object doesn't contain the element property because Element doesn't provide a toJSON() operation.
Examples
Calling toJSON() directly
This example obtains a LargestContentfulPaint object. Calling toJSON() directly returns a plain object. Its properties have the same values as the corresponding properties of the original object.
const observer = new PerformanceObserver((list) => {
list.getEntries().forEach((entry) => {
const json = entry.toJSON();
console.log(json); // A plain object
console.log(typeof json); // "object"
console.log(json.size); // Same value as entry.size
});
});
observer.observe({ type: "largest-contentful-paint", buffered: true });
Serializing to a JSON string
Within the callback from the previous example, the same object can be serialized using JSON.stringify(), which calls the toJSON() method automatically.
console.log(JSON.stringify(entry));
This would log a JSON string like so (formatted for readability):
{
"name": "",
"entryType": "largest-contentful-paint",
"startTime": 468.5,
"duration": 0,
"navigationId": 2463,
"paintTime": 460.25,
"presentationTime": 468.5,
"size": 19824,
"renderTime": 468.5,
"loadTime": 0,
"id": "",
"url": ""
}
Specifications
| Specification |
|---|
| Largest Contentful Paint # dom-largestcontentfulpaint-tojson |