Largest Contentful Paint and image delivery
A prominent hero or article image may become the Largest Contentful Paint element. Its discovery time, network priority, server response and byte size can all matter. Correct dimensions and a suitable format help, but markup and delivery also determine when the browser can fetch it.
Avoid lazy-loading the likely above-the-fold LCP image. For images below the fold, lazy loading can delay unnecessary downloads until they approach the viewport.
Cumulative Layout Shift and decoding
Set width and height attributes or a stable aspect ratio so the browser reserves space before an image downloads. This helps avoid content jumping as intrinsic dimensions become known.
Large decoded images consume memory even when the compressed file is small. Delivering reasonable pixel dimensions helps network transfer and memory use. Check field performance across real devices; lab scores alone may not capture the full experience.
Frequently asked questions
Does compressing images guarantee better Core Web Vitals?
No. It can reduce transfer bytes, but metrics also depend on layout, request priority, caching, server response and other page resources.