Lazy load to cards

[janez72]

Would be possible to add lazy load function to images in cards?
Or is there another way to add it in this moment?

[BaconFries]

Similar question see Pablo's reply
https://www.wysiwygwebbuilder.com/forum ... 4&p=435983

[janez72]

Alternative could be to put in event in Card Container - onscrollreveal.
I tried, it's working, but the reveal starts as soon as the page is previewed.
Even if not scrolled and in focus yet.
I tried with onfocus - nothing. The card never shows up.

Any other ideas?
And even if it works - does it stop the images from being loaded?

It can be a very bad sign for SEO and load speed if you have 100 images on page and no lazy load.

[Pablo]

You can post suggestions here:
https://www.wysiwygwebbuilder.com/forum ... m.php?f=28

If more users find it useful then I will consider it for future development.

Note however that usually the images in a card are very small, so it should not have too much impact the loading speed.
The 'lazy load ' script may even take more time to load than the images...

[janez72]

Lazy load is loaded any way, since not images are in cards and we apply lazy on other images.
On all pages with many cards, lazy load would be very useful.
Margins in competitive niches are very narrow, miliseconds can be a factor.

So there is no way to get around it in a moment? With events on cards or images?

[Pablo]

Sorry, there is currently no standard option for this.

[janez72]

Ok, I hope you will apply this in future, as Lazyload is a top factor for speed, if you are dealing with 100 or more images on page.

In the meantime, I tried to solve it on server level.
I added img src="images/placeholder.gif" to all non-lazyloaded images.
And of course added the data-src="original image URL"

But it seems like it's not working.
No images were visible with this change on live page.

If I added loading="lazy" in the image line, then all js on page was not responsible anymore.
Although, PageSpeed insights recognized lazy load, but none of the js worked anymore.
JS is put on bottom of the page and is mininized.

Any other solution, server based?
I know it's not directly related to WYSIWYG but this issue is essential for Google search and therefore for our online rankings.

[Pablo]

I'm sorry, I cannot help you modify the code.
But you can post suggestions in the "Suggestions" section of the forum. If more users find this useful then I will consider this for future development.