How to Lazy Loading anything

You probably know about loading="lazy" for images and iframes but what if you want to do something similar with a div or any of your components… To the rescue CSS with content-visibility: auto

content-visibility is a CSS property that controls whether and when an element’s content is rendered. It only renders the content of an off-screen component when it becomes on-screen. As an example I use it as sustituted of Svelte Lazy component what it’s great but I prefer as less dependences as possible. Keep in mind that as of the date of this post, this porwerful CSS property is not supported everywhere.