Newly available 主要ブラウザで対応済みだが、古いバージョンでは未対応の場合がある。

対応ブラウザ

機能 デスクトップ モバイル
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
77
79
122
26.2
77
26.2

LargestContentfulPaint インターフェースの read-only プロパティは、最大のコンテンツフルペイントとなる Element を表すオブジェクトを返します。

77
79
122
26.2
77
26.2

LargestContentfulPaint インターフェースの read-only プロパティ `id` は、最大のコンテンツペイントとなる要素の ID を返します。

77
79
122
26.2
77
26.2

LargestContentfulPaint インターフェースの read-only プロパティである loadTime は、要素が読み込まれた時刻を返します。

77
79
122
26.2
77
26.2

LargestContentfulPaint インターフェースの `renderTime` 読み取り専用プロパティは、要素が画面にレンダリングされた時刻を表します。

77
79
122
26.2
77
26.2

LargestContentfulPaint インターフェースの size 読み取り専用プロパティは、最大のコンテンツ描画(Largest Contentful Paint)となる要素の本質的なサイズを返します。

77
79
122
26.2
77
26.2

LargestContentfulPaint インターフェースの toJSON() メソッドはシリアライゼーションであり、LargestContentfulPaint オブジェクトの JSON 表現を返します。

77
79
122
26.2
77
26.2

LargestContentfulPaint インターフェースの read-only プロパティ `url` は、要素が画像である場合、その要素のリクエスト URL を返します。

77
79
122
26.2
77
26.2
1+対応 (バージョン) 未対応 注釈あり サブ機能の解説は MDN Web Docs (CC BY-SA 2.5)

実務での使いどころ

  • Largest contentful paint (LCP) の活用

    LargestContentfulPaint インターフェイスは、ウェブページ上でユーザー入力が行われる前に描画される最大の画像またはテキストに関するタイミング情報を提供します。

注意点

  • 古いブラウザでは対応していない場合がある。

実装メモ

  • 一部の API はセキュアコンテキスト (HTTPS) やユーザー操作起点を必要とする。利用前に要件を確認すること。