https://sap.github.io/spartacus-docs/deferred-loading/

Deferred loading is a technique that is used to postpone the rendering of CMS components. Any component that is outside the viewport (that is, the area that is visible to the user) is not rendered in advance. This improves the initial rendering of the complete page. Deferred loading not only defers the creation of components, it also defers the loading of any component-specific data, such as media or back end calls.

viewport之外的任何Component，即用户肉眼看不见的Component，都不会提前被渲染。延迟loading不仅仅延迟了Component实例的创建，而且延迟了Component相关的数据加载，比如media文件或者Commerce Cloud后台的API调用。

一些典型的延迟加载的应用场合：

The components used in the hamburger menu are deferred on mobile devices, since they are not inside the viewport when the menu is collapsed. This defers the creation of those components, as well as loading languages, currencies, navigation, and CMS links.

Product reviews are loaded in the product review component. As long as the user has not tabbed or scrolled into the review component, those reviews are not loaded.

Carousel slides outside the viewport are deferred until the user “scrolls” to them. This not only reduces back end calls for additional carousel data (such as products), but it also defers the loading of images.

延迟加载的实现基于page slot. 一旦page slot进入viewport，page slot里所有的Component均会被加载。

延迟加载默认是禁止状态，需要显式开启：

延迟加载对Server side渲染无效——爬虫总是能获取到完整的DOM.

和延迟加载相关的一些技术

Lazy loading of JS chunks: Deferred loading does not lazy-load the component JS bundles. Deferred loading is only concerned with the creation or rendering of components.

Component延迟加载和js bundle的延迟加载无关，只涉及到Component实例创建和渲染的延迟进行。

Above-the-fold loading: Deferred loading is tightly coupled to so-called “above-the-fold loading”.

Native lazy loading of images: Deferred loading is not related to the native lazy loading of images that has recently been implemented in some browsers. This new API is not yet fully supported, but could be used in combination with deferred loading for CMS components.