let lastLcp; const po = new PerformanceObserver((entryList) => { const entries = entryList.getEntries(); for (const entry of entries) { if (entry.startTime !== lastLcp) { console.log( `New LCP: ${entry.startTime}ms Size: ${entry.size} px^2 HTML: ${entry.element ? entry.element .outerHTML.slice(0, 80): "(no element)"}` ); lastLcp = entry.startTime; } } }); po.observe({ type: "largest-contentful-paint", buffered: true });
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter