5.5 lazy loading doesn’t work for me

You don’t need to expect the appearance of images in front of your eyes. The actual behaviour depends on a browser. More than 70% of browsers currently on usage support it. The key point is that even if images are right in the viewport and have the attribute ‘loading’ equal ‘lazy’, the will be summoned as soon as possible but they are not delaying a start of user’s interaction with the page. This way we have an improvement in Page Speed and UX. Images way below viewport will be not uploaded until the user will be getting close to them. This way we are saving resources and traffic for a server and for a user’s browser.

The new lazy loading feature doesn’t work like older javascript hacks did.

That loading="lazy" parameter tells the browser to load the images lazily. Most browers support it nowadays.

If you’re expecting images to “pop in” when you scroll to them, then that’s because you’re used to the old JS code not always working properly. What you should see is just the page, as per usual. It lazy loads them in the background before they are needed.

See https://web.dev/native-lazy-loading/ for some examples.

Thanks for the response but I guess you misundertood me. I am a web developer and use up-to-date stable releases of the most common browsers (firefox 79, chrome 84). I also used the console to check the lazy loading. On an example page with a document height of 7800px and a viewport height of 880px all images were loaded after page init. When I used blzay I configured it that images also didn’t “pop in” when they reach viewport but with an offset of 200px below/above viewport. Ofc they could pop in depending on the scrolling speed or image size but it checked out. In the native/wordpress case the offsset seems to be >7000px and I don’t imagine it’s that way (since that’s the difference in height and I don’t see any image loading after start scrolling). So my point still stands.
Since I am expecting that this behavior was tested multiple times before release and it’s a HTML standard it should work but in my case it doesn’t and I only know what I posted above.

I do not know how you are checking, but on a fairly normal setup, you can see the lazy loading work in the inspector by simply examining the Network tab to see the resources load as you scroll around, rather than as you load the page.

There is no “offset” involved. The images simply don’t load until you get to them. However you are measuring loading sounds incorrect to me.

I also used the console to check the lazy loading

lazy loading work in the inspector by simply examining the Network tab

This is exactly what I was doing.

If you’re expecting images to “pop in” when you scroll to them, then that’s because you’re used to the old JS code not always working properly.

here is no “offset” involved. The images simply don’t load until you get to them.

If the images load when my viewport hit their position they will pop in. That’s why old js code lazy loaders – which worked properly in my cases – used an offset to start loading an image before it hits the viewport.

on a fairly normal setup

It’s a bit of a special case for me because I use a shortcode to load my images and therefore custom code

Nevermind. I don’t know what went wrong but I tried implement it again and now it works. Maybe I had some typo in my code or something. I will still use js lazy because of compatibility (50% of my users use safari and native loading is not supported there by default)