In short
Images, embeds, videos, scripts, and heavy components can be loaded only when they approach the viewport or become necessary for the task.
The first screen needs different treatment. Hero images, primary content, and interaction-critical scripts should not be delayed just because lazy loading is available.
Where it bites
Lazy loading bites when a performance fix is applied blindly. The page may score worse because the LCP image is delayed, content jumps into place, or a user action waits for code that should have been ready.
What to check
- Is the LCP image or primary content excluded from lazy loading?
- Are image dimensions reserved so layout shift does not increase?
- Do below-the-fold assets load early enough for real scrolling behavior?
Common questions
What is lazy loading?
Lazy loading delays non-critical assets, such as images, embeds, scripts, or components, until the user is likely to need them.
Does lazy loading always improve performance?
No. It helps when applied to non-critical assets. It can hurt performance when it delays the hero image, important content, or interaction code.
What should you check first for lazy loading?
Check the LCP element, image dimensions, below-the-fold media, script timing, and whether real-device testing confirms the page feels faster.