Add amount of next/prev slides to preload lazy images in.

[sun-ks]

[gggritso]

This is really great! @sun-ks are you able to resolve the conflict on this PR? Would love to see it merged!

[rolecs]

lazyLoadEager for Tiny Slider 2

[kilianso]

Any update on this? This would be an extremly useful feature!

[yagayente]

Just tested it ! Amazing ! One more thing would be nice to implement here : that when you load the page, it could preload the first next image (as it is now) AND the first image BEFORE. So that everything run smoothly. Could it be possible to implement that ?

[capsulated]

Two years have passed. The PR of the killer feature is still open. Why? @ganlanyuan

[baesek]

I want to use the feature of lazy preloading previous and next slides, but the files in the dist folder of the repository https://github.com/sun-ks/tiny-slider are not the files in the src folder processed by gulp. I tried to use docker to process update the files in the dist folder by running the desired tools in the docker environment ( i never used it before ) as described here : https://github.com/ganlanyuan/tiny-slider/blob/master/CONTRIBUTING.md

But when i modify a file to trigger the gulp watch tasks I get the following errors:

tiny-slider | [Browsersync] Serving files from: ./ tiny-slider | [12:01:56] Starting 'makeDevCopy'... tiny-slider | [12:01:56] Starting 'script'... tiny-slider | [12:01:56] 'script' errored after 53 ms tiny-slider | [12:01:56] Error: Unexpected token tiny-slider | at error (/tmp/node_modules/rollup/dist/rollup.js:199:15) tiny-slider | at Module.error (/tmp/node_modules/rollup/dist/rollup.js:17179:9) tiny-slider | at tryParse (/tmp/node_modules/rollup/dist/rollup.js:16854:16) tiny-slider | at Module.setSource (/tmp/node_modules/rollup/dist/rollup.js:16919:33) tiny-slider | at /tmp/node_modules/rollup/dist/rollup.js:20708:20 tiny-slider | at tiny-slider | at process._tickCallback (internal/process/next_tick.js:188:7) tiny-slider | [12:01:56] Finished 'makeDevCopy' after 153 ms

Does anyone know how to get the processed files (which should be in the dist folder) for this feature: https://github.com/ganlanyuan/tiny-slider/pull/419/commits/742eade2186d24c9a20ed9cd88ee621ee57dc846

Or @sun-ks could you send me the files in the dist folder so i can use the feature?

Thank you for any help, i am so confused by these endless wrappers ... It is so unclear for me, what steps need to be done to work on code which is embedded into all those other dev tools environments or how to call it.

I am on Mac OS Catalina 10.15.7

best!

[dijkermans]

@ganlanyuan lazyLoadEager would be really great because swiping or mousedragging stops loading new items until you release the mouse or until you stop swiping. You'll see blank items and empty ALT tag boxes.

[dijkermans]

@sun-ks Works great! A slight improvement request though: If you set different values for different breakpoints then the value needs to be updated if you change the size of the viewport.

responsive: {
  0: {
    items: 1,
loadPrevNext:1,
  },
  580: {
    items: 2,
loadPrevNext:2,		
  },
  1200: {
    items: 3,
loadPrevNext:3,				
  },
  2000: {
    items: 4,
loadPrevNext:4,				
  }

So let's say the viewport size is 1920px it uses LoadPrevNext 3. But if you change it to 480px then it's still 3. If you refresh the page then it uses value 1.

[mattmortek]

If anyone is looking for a working solution for this problem, please use this fork: https://github.com/b2storefront/tiny-slider