Re: [whatwg/dom] Declarative Shadow DOM (#510)

Hi! It's me again. Sorry. Some background:

- https://github.com/skatejs/ssr
- https://www.youtube.com/watch?v=yT-EsESAmgA
- and oh so many twitter discussions with React folks; too many to ever find and list

I've tried to keep most of the history and rationale for our thoughts in the README of the skatejs/ssr repo, but some of it might be missing. It's worth a study to at least see where we're coming from.

The thing I've found most interesting in this work is that the imperative API is exclusive in its DOM behaviour. For example, `<div>test</div>` means something completely different when `attachShadow()` is imperatively invoked. Finding a declarative equivalent that doesn't break existing assumptions is difficult. For example:

```html
<div>
  World
  <shadow-root>
    Hello, <slot />!
  </shadow-root>
<div>
```

Whether or not this is used with a `<template />` element or something else, there's several problems with this:

1. SEO and content order when read in engines that don't execute JS.
2. What happens to `<shadow-root />`? Does it get removed?
3. What happens to `childNodes`? Attaching a root modifies this.
4. Does `appendChild(document.createElement('shadow-root'))` work?

Libraries like React (and many more) have based themselves on the pillar that a core subset of DOM works as intended. If appending a shadow root mutates the host and makes `childeNodes` behave differently, this breaks the web. Inversely, if this only available to the initial parse, it seems inconsistent. Meaning if `<div><shadow-root /></div>` is only available to the parser, but means nothing when using the imperative alternatives (i.e. `appendChild(shadowRootElement)`), then expectations of declarative vs imperative APIs are inconsistent.

I'm sorry if my thoughts seem a bit disjointed right now. Somebody linked this to me and it's a bit late here, but I really wanted to lay out some of my thoughts otherwise I may have forgotten about it (I do web components in my spare time).

I'm excited to see traction on this!

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