Following empty space is intentional. Scroll down for an image preview.
Preview image
If checked and the browser supports, native lazy-loading will be used, otherwise lazysizes library will be used for all browsers.
Elements having this class name will be ignored.
Suggestion: 1x1 pixels transparent GIF: data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==
When it is checked the default CSS transition effect is applied with matching class names.
When it is checked the minified versions of the library files are used.
/lazysizes.min.js
For most Drupal instances, the path to the lazysizes plugin would be under the libraries folder in the web root. If you need to serve it from a different local path, or even from an external domain you can define it here:

Examples:
/libraries/lazysizes
/profiles/{your_profile}/libraries/lazysizes
https://example.com/libraries/lazysizes
This configuration applies to both image fields and inline images/iframes on following pages.
Specify pages by using their paths. Enter one path per line. The '*' character is a wildcard. An example path is /user/* for every user page. <front> is the front page.

unchecked (default): lazy-loading is enabled on ALL pages except the specified pages.

checked: lazy-loading is enabled ONLY on the specified pages.

lazysizes is a fast (jank-free), SEO-friendly and self-initializing lazyloader for images (including responsive images picture/srcset), iframes, scripts/widgets and much more. It also prioritizes resources by differentiating between crucial in view and near view elements to make perceived performance even faster.

The plugin can be configured with the following options. Check out the official repository for documentation and examples.

Marker class for all elements which should be lazy loaded.
This class will be added to any element as soon as the image is loaded or the image comes into view. Can be used to add unveil effects or to apply styles.
This class will be added to img element as soon as image loading starts. Can be used to add unveil effects.
Marker class for elements which should be lazy pre-loaded after onload. Those elements will be even preloaded, if the preloadAfterLoad option is set to false.
The error class if image fails to load
The attribute, which should be transformed to src.
The attribute, which should be transformed to srcset.
The attribute, which should be transformed to sizes. Makes almost only makes sense with the value "auto". Otherwise, the sizes attribute should be used directly.
For data-sizes="auto" feature. The minimum size of an image that is used to calculate the sizes attribute. In case it is under minSize the script traverses up the DOM tree until it finds a parent that is over minSize.
The customMedia option object is an alias map for different media queries. It can be used to separate/centralize your multiple specific media queries implementation (layout) from the source[media] attribute (content/structure) by creating labeled media queries.
By default lazysizes initializes itself, to load in view assets as soon as possible. In the unlikely case you need to setup/configure something with a later script you can set this option to false and call lazySizes.init(); later explicitly.
The expFactor is used to calculate the "preload expand", by multiplying the normal expand with the expFactor which is used to preload assets while the browser is idling (no important network traffic and no scrolling). (Reasonable values are between 1.5 and 4 depending on the expand option).
The hFac (horizontal factor) modifies the horizontal expand by multiplying the expand value with the hFac value. Use case: In case of carousels there is often the wish to make the horizontal expand narrower than the normal vertical expand option. Reasonable values are between 0.4 - 1. In the unlikely case of a horizontal scrolling website also 1 - 1.5.
The loadMode can be used to constrain the allowed loading mode. Possible values are 0 = don't load anything, 1 = only load visible elements, 2 = load also very near view elements (expand option) and 3 = load also not so near view elements (expand * expFactor option). This value is automatically set to 3 after onload. Change this value to 1 if you (also) optimize for the onload event or change it to 3 if your onload event is already heavily delayed.
Whether to load visibility: hidden elements. Important: lazySizes will load hidden images always delayed. If you want them to be loaded as fast as possible you can use opacity: 0.001 but never visibility: hidden or opacity: 0.
The timeout option used for the requestIdleCallback. Reasonable values between: 0, 100 - 1000. (Values below 50 disable the requestIdleCallback feature.)
The timeout option used to throttle all listeners. Reasonable values between: 66 - 200.
Plugins
Review the documentation before enabling any of the plugins. Enabled plugins may offer additional configuration which you can override via window.lazySizesConfig