How to lazy load images?

Hello -
Curious if anyone knows how I can lazy load images onto a page on readymag? Right now, the entire page loads (page size is about 15MB) and because all of the images are loading at once, it is affecting my page speed.

Readymag does have the load animation where an image pops up once the user scrolls to that widget but it is not a true “lazy load” as the image itself is loading upon the initial page load regardless.

Any help is greatly appreciated!

you could seperate your page in several pages, this would decrease your loading time a lot. Also have a look at this thread: long-vertical-scroll-issues-loading

1 Like

Thank you for you reply!

Separating into pages would not be a viable option for my site.

The page doesn’t have issues loading and loads pretty quickly in actual use, I’m just looking at my PageSpeed insights and GTmetrix ranking and it sits at a very low C when, if the ability to lazy load the images were provided to users, I know I could improve that overall score and especially LCP.

I’m looking at websites with nearly twice/sometimes three times the size of mine and they’re ranking high Bs and As and it’s because they have lazy load implemented. It doesn’t make sense to have all the images load right off the back when the user won’t be seeing them until they scroll a bit.

Have you tried enabling ‘Progressive images loading’ toggle in project settings?

3 Likes