ressio / lazy-load-xt

Lazy load XT is a jQuery plugin for images, videos and other media
http://ress.io/lazy-load-xt-jquery/
MIT License
1.36k stars 245 forks source link

Why does lazyloadxt bind to touchmove AND scroll event? #91

Closed valnub closed 8 years ago

valnub commented 8 years ago

I noticed that lazyloadxt calls queueCheckLazyElements() whenever at least one of these events is called:

load orientationchange resize scroll touchmove focus

This means that on mobile devices queueCheckLazyElements() always gets called twice when the user scrolls the whole page. This is a pretty nasty performance issue on older devices. I especially noticed this on an iPhone5 with iOS9 on Safari Browser.

Would it be possible to remove touchmove from this list or provide a smarter solution?

CheemaSingh commented 8 years ago

You can choose the events as per your requirement, then bind them for lazy load as:

$.extend($.lazyLoadXT, {                
                updateEvent: 'click load orientationchange resize scroll '
            });

But you should not remove touchmove event, because if you have a touch slider on the webpage and you change the slide swiping right or left then it won't trigger the lazy load for the new slide unless user scroll down or click somewhere on the webpage!

valnub commented 8 years ago

@CheemaSingh Oh, thanks for the hint. That's very handy. However, I use my slider's onSlideEnd event to call $(window).trigger('scroll') after a slide transition has ended to trigger lazy load to get new images. I think that's way more efficient than applying touchmove on the whole page.