data-size="auto" config, preload delay time

[longvo55]

First of all, thank you for the great solution, it helps a lot for my current setup using owl carousel. Preemptively loading images is a relief.

I have two issues:
Using data-size="auto" for responsive images is great, though I currently have a masonry layout with covering the entire viewport, data-size="auto" is very good at picking the appropriate image size, but some of my masonry blocks is tall and cover up half of the viewport height, hence using the "appropriate" image size/ almost as close to the width of the masonry block results in undesirable look (pixelated) on that block. I can set the minSize to a bigger value but it will yield way bigger image size than needed. Still cannot fine tune the setting (more like I don't quite understand minsize).

Secondly, can I limit the loader to look for visible elements in the viewport only excluding the expand setting ? nvm this, I'll try your recommended solution #201.

lazySizesConfig.expand = docElem.clientHeight > 600 ? docElem.clientWidth > 600 ? 550 : 410 : 359;
I don't quite understand what it means if viewport is greater than 600px in height and width here.

And is it possible to define a time delay for preload ?

[aFarkas]

About your first issue: You should use the aspect ratio trick to define height and width of your images, then the right size is calculated and downloaded. (https://github.com/aFarkas/lazysizes#tip-specifying-image-dimensions-minimizing-reflows-and-avoiding-page-jumps)

Second: You got it.
The default value for expand is dynamic and checks, if clientheight and clientwidth is above 600 it uses an expand of 550, if only height is above 600 and width is below it takes 410 and if height is below 600 it takes 359.

And is it possible to define a time delay for preload ?
Don't know what you mean with this. But pretty sure that not. The only thing I can think of is a transition delay, that you can use.

Please close if this helps.