Performance
Lazy Load Generator
Native lazy & data-src patterns
Options
Adds loading="lazy" to
<img> and
<iframe>.
Optional data-src uses a tiny placeholder — wire your own lazy script if needed.
About the Lazy Load Generator
A lazy load generator that writes the HTML for images that load when they reach the screen, using the native lazy attribute or a data-src pattern.
How to use the Lazy Load Generator
- Paste the image address.
- Choose the native lazy pattern or the data-src pattern.
- Copy the markup into the page.
What to check
Do not lazy-load the first image on the screen. That image should load immediately.
What is native lazy loading?
It is the loading="lazy" attribute, which current browsers understand without an extra script.
When should I use data-src?
Use it when your own script swaps data-src into src. Native lazy is enough for most pages.