“img class=”slide lazy vcentered loaded”

Even the site logo gets lazy loaded (don’t know where to find this option). Both are the very first image elements and really should not be lazy loaded.

Any ideas? I’m on Customizr Pro.

Cheers, Alex

Well, except for one thing: There seems to be a conflict with the lazy-load feature of Perfmatters. When I activate this, the lightbox no longer works properly. It seems like Meow Lightbox is loading the placeholder images that are replacing the original images until they come into the viewport.

Perfmatters has the option to exclude images or parent containers of images from lazy loading, but that didn’t help. I tried various settings of Meow Lightbox but without success, too.

Any idea how to fix this? You can see the problem live on the page I have attached.

Cheers
Philipp

Please I want to disable lazy loading for above the fold images, I want to use the class “no-lazy” for this, I already tried different codes here and there but it doesn’t work. This is very important to improve Core Web Vitals.

Please help.

But there is one issue with lazy load (lazyload.js).

The issue seems to be related with lazy load of script files and when they are aggregated.

I excluded the lazyload.js file in Autoptimize, but the issue still arrives when I enable aggregation of JS files in Autoptimize.

Key issue is how Speed Booster Pack loads the inline JavaScript.

wp_add_inline_script( 'sbp-lazy-load', $lazy_loader_script );

This will load the inline code AFTER the lazyload.js file.
The documentation states, the inline code must come BEFORE loading the async script: https://github.com/verlok/vanilla-lazyload#using-an-async-script

So my fix currently is to modify the plugin and add the inline before the script:

wp_add_inline_script( 'sbp-lazy-load', $lazy_loader_script, 'before' );

Seems like Google Chrome can handle both cases, but Firefox won’t init the script and it is never executed.

Would be great to have this fixed in the next version.

Update:
just to clarify:
If the script is loaded async, then this issue happens.
Usually the script is not loaded async (or defer) and then this won’t be an issue. But when async is used, the script will execute immediately and will ignore the inline code AFTER the script tag. Therefore it must be placed BEFORE.

https://htmag.co.il/roidmi-eva-%D7%A8%D7%95%D7%91%D7%95%D7%98%D7%99-%D7%A9%D7%9E%D7%A0%D7%A7%D7%94-%D7%95%D7%9E%D7%A8%D7%95%D7%A7%D7%9F-%D7%90%D7%AA-%D7%A2%D7%A6%D7%9E%D7%95-%D7%9C%D7%91%D7%93.html

The difference is that on the first one I’m using W3 total cache “load lazy images” and on the second link I’m using the WordPress lazy load solution.

This may be because of the many small photographs of the featured profiles.

Could browser-level lazy loading be used, such that the images are only loaded by the browser when they are visible?

This won’t require any work other than marking the images as loading=”lazy” and letting the browser work out when the images should be loaded. See the below for details.

https://web.dev/lazy-loading-images/

I know I could install a plugin that does this, but each plugin installed slows WordPress down and can result in strange problems.

In any case this is not a big problem, only a nicety to have the feature of lazy loading on the front page.

1. Post/Page Title Featured Image
2. Single Post/Page Featured Image
3. Archives Featured Image
4. Related Posts Featured Image

Sorry if this has been asked before but the WordPress Forums search function doesn’t seem to be working at the moment.

reason:
Largest Contentful Paint image was lazily loaded
Above-the-fold images that are lazily loaded render later in the page lifecycle, which can delay the largest contentful paint
by that img: loading="lazy"

Any chance to add a lazy loading disabling option to your advanced image and perhaps advanced gallery block?