Lazy loading is enabled on your Shogun pages by default, you can read up more about what this implementation means, how this affects your pages, and what you can do to take full advantage of this feature.
What is lazy loading?
Lazy loading is the deferring of the loading of images until the image comes into view on the page. This means that not all images are loaded when the page is loaded, so fewer resources are loaded at the same time. Only images that are within the first 700px of the page are loaded on the page load time, the rest will benefit from the lazy load feature.
What is affected by this feature?
There are a few elements that have this feature applied by default, these are as follows:
Custom element images
Product image element
Product gallery image element
Container element background images
When using a Slider element, once the Slider element comes into view, all images within the Slider element will be loaded. This is to prevent inconsistent heights of images.
A few elements are currently not affected by this feature but are planned in future iterations of Shogun.
Container element background videos
Element backgrounds (excluding Container element)
Images in the top 700px of your page (or "above the fold") are loaded upon page load. Images below the fold are lazy loaded.
Images displayed through HTML embeds will not have lazy loading applied to them.