Re: [whatwg/dom] Proposal to improve the DOM creation api (#150)

justinfagnani left a comment (whatwg/dom#150)

A little while back I opened https://github.com/WICG/webcomponents/issues/1069 to propose that we add a declarative JS template API to solve this problem, which would look roughly like:

> ## Idea
> 
> Add an `HTMLElement.html` template tag and an `HTMLElement.render()` method that would allow describing the desired DOM structure in JS, along with bound data for interpolation and updating.
> 
> Templates would be written as tagged template literals using the `HTMLElement.html` tag:
> 
> ```ts
> const {html} = HTMLElement;
> 
> const renderPost = (title, summary) = html`
>   <h1>${title}</h1>
>   <p>${summary}</p>
> `;
> ```
> 
> Templates would be rendered to an element with the `HTMLElement.render()` method:
> 
> ```ts
> document.body.render(renderPost('Hello World', 'This is a template'));
> ```
> 
> DOM rendered from a template can be updated by re-rendering with the same template, preserving the static DOM and only updating the bindings that changed. This would be done with DOM Parts.
> 
> ```ts
> // Only updates the <h1> element created from the template. No other DOM updates.
> document.body.render(renderPost('Hello Templates', 'This is a template'));
> ```

Since then I've been working on a more concrete proposal here: https://github.com/justinfagnani/dom-templating-api-proposal

If anyone here is interested, I'm looking for feedback, suggestions, and co-champions!

-- 
Reply to this email directly or view it on GitHub:
https://github.com/whatwg/dom/issues/150#issuecomment-3514163276
You are receiving this because you are subscribed to this thread.

Message ID: <whatwg/dom/issues/150/3514163276@github.com>