Why it matters
Without intrinsic dimensions the browser reserves 0px and shifts the layout when the image loads.
How to fix it
Add width and height attributes (CSS can still scale with height:auto) or set aspect-ratio in CSS.
Example
<img src="/card.avif" width="640" height="360" style="height:auto" alt="…">References
More performance rules
void perf reports 25 rules in this category. Core Web Vitals and bytes: LCP, CLS, TBT, TTFB, JavaScript, CSS, fonts, images, caching and compression, measured as the median of several runs on a throttled mobile and a desktop profile.
lcp-image-no-priorityLCP image has no fetchpriority="high"lcp-background-imageLCP element is a CSS background imageimage-oversizedImage is much larger than its rendered sizeimage-legacy-formatImage served in a legacy formatrender-blockingRender-blocking resources delay first paintno-text-compressionText resources are served uncompressedcache-headersHashed static assets are not cached long-termthird-party-heavyHeavy third-party footprint