search

aFarkas / lazysizes

High performance and SEO friendly lazy loader for images (responsive and normal), iframes and more, that detects any visibility changes triggered through user interaction, CSS or JavaScript without configuration.
MIT License
17.47k stars 1.73k forks source link

Issue with multiple video instances #658

Closed vikasneugi closed 5 years ago

vikasneugi commented 5 years ago

I have using the video-embed plugin to lazyload the vimeo videos on one of my page. Its working fine when there is only one video instance on the page, but when there are 2 or more instances of the video the lazyloading only lazyloads either one or none of the videos. But when you refresh the browser (not hard refresh), both the videos work fine. Page link : https://www.davidharber.co.uk/chelsea19/nyneve.htm So when the page is accesed by clearing the cache the lazyloading is having some issues. Any help would be greatly appreciated Thanks

aFarkas commented 5 years ago

You have included the vimeo plugin inside of flickity_lazysizes.js and the included the lazysizes core inside of production.js files. And production.js is loaded before flickity_lazysizes.js. this way there is a race condition happening. Sometimes lazysizes executes before the plugin is loaded and sometimes not.

You should include lazysizes with all plugins into one or make sure that the plugins are loaded earlier then the core or make sure to delay execution of lazysizes until all plugins are loaded.