Added lazyLoad option 'anticipated' to preload {n} images #2456
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
So that the user experience is better, the images should be loaded on demand, but anticipated, meaning, that the slider will always be one step ahead of the user, by pre-loading the 1 next and 1 previous image so that the loading is seamless, without ever making the user aware that the image was loading. On the other hand, this represents an improvement over loading all the images progressively, as the amount of data to load might not be worth causing also a poor experience, specially on mobile devices with slow connections.
Demo
http://jsfiddle.net/zeL1kmo3/12/
Process
There are a few edge cases in which lazyLoad === 'anticipated' might not work as expected, they are rooted on the nature of the current implementation, some bugs and limitations:
cloned
item, so scrolling 2 shows an empty image during the animation This can be see in line https://github.com/kenwheeler/slick/blob/master/slick/slick.js#L2034, asslidesToShow
is used whereslidesToScroll
should be the amount of clones to set-up.fade == true
, the rangeEnd seems to be +1 count too much, this is either related to another bug or an implementation feature I am not aware of.Credits to @AlaaSarhan for his collaboration bringing this feature to life.