Page 1 of 1

Lazy loading a slideshow **CLOSED**

Posted: Sat Jul 28, 2018 10:10 pm
by fiik
I have a couple of sites now with slideshows. The images in the slide show average about 45Kb each. We can reduce the image sizes to an average about 28Kb, but by this point the images look terrible.
On one site the slide show has 12 images, on another it has 30, This causes very poor looking loading of the page.
On the bigger site, page load can take upto 7.5 seconds before all elements fall into place and the page looks nice.

I am looking for a method by which i could load the first slide, then the rest of the page loads, then it comes back to load the rest of the images for the slideshow. (not sure if you would really call this lazy loading)
Basically to make the loading look neater, smoother. So all parts of the site fall into correct position quicker rather than waiting for all slide images to load.

example site www.dabeat.com.au (12 image), www.vixenphotographics.com.au (30 image slideshow)

Any ideas how i can accomplish this?

Re: Lazy loading a slideshow

Posted: Sun Jul 29, 2018 7:40 am
by Pablo
Sorry, that is not possible. For a sideshow, the images need to be preloaded otherwise the animations will not work.

Re: Lazy loading a slideshow

Posted: Sun Jul 29, 2018 2:59 pm
by andyp
I had a look at the 30 image slideshow and these loaded with no issues... but I am on 50mb broadband.... so maybe this could be down to a slower broadband speed?

Re: Lazy loading a slideshow

Posted: Mon Jul 30, 2018 2:20 am
by fiik
is it possible to use something like Slick carousel http://kenwheeler.github.io/slick/
it says it has lazy loading.

can this be integrated into WWB, by an end user such as i?

Re: Lazy loading a slideshow

Posted: Mon Jul 30, 2018 6:40 am
by Pablo
You can use the HTML object to add custom code. In combination with the File Publisher object.
Or you can create your own extension.

Re: Lazy loading a slideshow

Posted: Mon Jul 30, 2018 6:45 am
by fiik
Thanks Pablo.

Re: Lazy loading a slideshow **CLOSED**

Posted: Sat Feb 02, 2019 11:03 pm
by fiik
This is an old topic of mine, but I thought I would update it.

The lazy loader mentioned previously worked ok.

However I did a simple work around.

Instead of putting the slide show into a layout grid which is flexible height and does not get its height until the slide show fully loads,
I put the side show into a layer, with fixed height (which was altered for various breakpoints), this makes the page load correctly with the appearance of being cleaner and faster