Real-World Svelte

11

Renderless Components

A renderless component is an advanced concept in Svelte that allows developers to create reusable components without rendering any HTML elements within the component itself.

This technique is particularly useful when leveraging Svelte to render on a canvas or in a 3D context, where the rendering of an HTML template by Svelte is not required. Instead, the canvas and Web Graphics Library (WebGL) offer an imperative API to produce graphics on the canvas. With the renderless component technique, it becomes possible to design components that enable users to describe the canvas declaratively, allowing the component to translate it into imperative instructions.

Another use case for a renderless component is to create components ...