What's New
Viewing 4 posts - 1 through 4 (of 4 total)
Viewing 4 posts - 1 through 4 (of 4 total)
You must be logged in to reply to this topic.
Hi,
“Lazy Load” has the following description : “Delays loading of images. Images outside of viewport won’t be loaded before user scrolls to them. Great for mobile devices to speed up page loadings.”
Please look into the next private message with the recorded “video1”.
Conditions:
– Product slider with 12 images.
– Only 2 images are visible at a time of initial page load.
– “How to display products” option : Slider
1) “Lazy Load” is enabled. Why it takes some time (0.5…1 second) to load 2 visible images ? looks like all 12 images are loaded.
2) “Lazy Load” was disabled. you could see that the first slider’s image appears immediately !
When I switch to “Grid View” or “Simple layout” – I see that all images loaded almost immediately.
The delay in Slider mode with “Lazy Load=ON” only.
The video was created on fast computer and you still see delay. When I am doing this test on mobile phone – the delay takes 2 seconds. – too slow for LAZY LOAD mode with 2 images only on a screen!
Questions:
1) Why for the Lazy Load enabled – the first 2 images are not loaded immediately? code bug?
2) Could you confirm that the “Lazy Load” mode loads only 2 visible images only? and the rest 10 images are not loaded until I scroll to them ?
The video2 shows you that the invisible third image is loaded when the page is loaded. Why? the image is hidden, it should not be loaded during the initial Page load (lazy Load= ON) and should be loaded automatically after the slider with visible 2 products was rendered and visible to end-user.
Could you investigate my findings and explain me if it is possible to fix the initial load speed of slider modules?
HI Jonny,
my site has 3 sliders on home page. Each slider has 2 images visible on mobile phone and 10 images hidden.
The attached screen shots (from Chrome Audit) could show you that all sliders images were loaded before the user could see the first to images.
1) 1,1s…1.2s – all sliders images were downloaded
2) 1.3s – the first 2 images were shown in browser
My opinion – The “Lazy Load” is not working at all. All 24 images from all 3 sliders (2 * 12 = 24) loaded before the first 2 images from the first slider becomes visible.
The speed difference in Chrome on desktop (F12 -> mobile mode) it is 0.2s
But on real mobile phone (not the fast one) it is longer: it takes an additional 1 second to show 2 images.
If I change the number of slider images from 12 to 2 for each of 3 sliders then I could see first 2 sliders on home page faster: 1 second faster on real phone (it is a HUGE speed difference!).
Could you investigate (Lazy Load mode) and fix it?
Regards,
Sergiy
The lazy loading feature works fine.
One thing you probably don’t know, which is “Pre loading”. Product slider modules will pre-load a certain amount of images, so when the user clicks on Prev/next button, they can see images immediately without waiting for them to load.
I will add option to disable the Pre loading feature in next theme update.
Currently, you can disable the feature by replacing this lazyLoadingInPrevNext: true, with lazyLoadingInPrevNext: false, in the \themes\transformer\templates\catalog\slider\script.tpl file.
You must be logged in to reply to this topic.