bqkc/docs/lazyload.md

Lazyload images

To avoid making browser load times too long, it is best to defer loading images until they are actually visible to the user. To do this CollectionBuilder uses lazysizes library. Lazysizes is a simple to use, up-to-date lazyload library that requires no initialization, and will simply load all images if browser support is missing.

Since lazysizes is used on most pages in the project, lazysizes.min.js is loaded as part of the default template in the foot.html include.

For images that should be lazy loaded, add class="lazyload" and replace normal src with data-src. No initialization is necessary.