Newly available Newly available. Verify your target environments before adopting.

Largest contentful paint (LCP)

The LargestContentfulPaint interface provides timing information about the largest image or text paint before user input on a web page.

Observers and Performance

Browser support

Feature Desktop Mobile
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
LargestContentfulPaint
77
79
122
26.2
77
26.2
element

The element read-only property of the LargestContentfulPaint interface returns an object representing the Element that is the largest contentful paint.
77
79
122
26.2
77
26.2
id

The id read-only property of the LargestContentfulPaint interface returns the ID of the element that is the largest contentful paint.
77
79
122
26.2
77
26.2
loadTime

The loadTime read-only property of the LargestContentfulPaint interface returns the time that the element was loaded.
77
79
122
26.2
77
26.2
renderTime

The renderTime read-only property of the LargestContentfulPaint interface represents the time that the element was rendered to the screen.
77
79
122
26.2
77
26.2
size

The size read-only property of the LargestContentfulPaint interface returns the intrinsic size of the element that is the largest contentful paint.
77
79
122
26.2
77
26.2
toJSON

The toJSON() method of the LargestContentfulPaint interface is a Serialization; it returns a JSON representation of the LargestContentfulPaint object.
77
79
122
26.2
77
26.2
url

The url read-only property of the LargestContentfulPaint interface returns the request URL of the element, if the element is an image.
77
79
122
26.2
77
26.2
1+Supported (version) Not supported ※Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)

Use cases

  • Using Largest contentful paint (LCP)

    The LargestContentfulPaint interface provides timing information about the largest image or text paint before user input on a web page.

Cautions

  • May not be supported in older browsers.

Implementation notes

  • Some APIs require a secure context (HTTPS) or user activation. Check the requirements before use.

Related links