I’m trying to improve my Google Speed Test score on mobile. At the bottom of the website is an Owl Carousel with over 50 company logos. I have turned off this section which holds the carousel on mobile, however, the images still download. As there are many images in the carousel this is causing the slow loading times on mobile. The logos are being pulled in from the CMS, I’ve set those to be lazy load but they’re still being downloaded when you first visit the site.
This is only possible using custom code. You would have to determine the viewport dimensions and then load the html into the page when the viewport was larger than X. You could use Ajax to load the content from another page so you could still rely on a dynamic element from it.
You really have to ask yourself if an array of logo’s wouldn’t be better represented with a few images if at all.
Hi, I forgot to address your point: The carousel of logos is something our client has come to expect and feels offers companies a little more exposure. Owl Carousel does have lazy load but I can’t seem to get to work: Lazy Load Demo | Owl Carousel | 2.3.4
Thanks for the Tiny Slider reference Jeff. I did not know Owl was no more. I’ll have to duplicate the page in question and see if I can get the tiny slider working.