There's now +4 hours of video content on ModernDevTools.com!

«   Previous tip Next tip   »

Chrome DevTools: Identify which element contributed to the Largest Contentful Paint

10th September 2019
Identify which element contributed to the Largest Contentful Paint

The Paint Timing Markers in DevTools highlights key rendering milestones in your page load. Milestones include:

The Largest Contentful Paint marker in DevTools can now pinpoint which element was considered for this event. To see the element (once you have a Performance Panel recording), you have a few options:

The Performance Panel has a heap of information, to make things easier, you can often correlate easy-to-identify markers, like the LCP, to Network events and rendering screenshots, all within the same Performance Panel recording.

«   Previous tip Next tip   »

Sign up to receive a developer tip, in the form of a gif, in your inbox each week