bahrus / laissez-dom

Lazy-load content from a template

laissez-dom

laissez-dom allows a template to be instantiated only after it becomes visible.

Use case I. Loading a large DOM tree, only part of which is visible. This use case may have recently been knee-capped by content-visibility. However, unless I'm missing something, laissez-dom can more than hold its own against content-visibility, at least in some scenarios. (Native support for search, though, is definitely a significant plus for content-visibility).

Use case II. If a lazy-loading solution is in place for lazy-loading dependencies required by a web component, then laissez-dom can be useful for that scenario.

Use case III. If you are working with DOM elements that can be put into sleep mode via the disabled attribute, laissez-dom will do that as well.

Syntax:

<laissez-dom>
    <template>
        <my-high-cost-custom-element></my-high-cost-custom-element>
    </template>
</laissez-dom>