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

> Flickering can be solved as the browser would, by processing in a bottom-up up order, so that all content is still in a template until the top-level template is hydrated.

The flickering I experienced with [my prolyfill custom element](https://github.com/tomalec/declarative-shadow-dom) is for the cases like:
```html
<div>
  <template is="shadow-root">
    <link rel="stylesheet" href="make-div-green.css">
    <div>I'm green</div>
    <slot></slot>
  </template>
  <div>I'm black</div>
</div>
```
It flickers even if I have preloaded this stylesheet or loaded it in different shadow tree, as it still needs to load it separately here.

Then to avoid the flash of unstyled content, I need to:
 1. set `display: none` to the host, 
 2. attach shadow,
 3. wait for all resources to be loaded, which is tricky due to lack of [`link.loaded` promise ](https://github.com/whatwg/html/issues/127),
 4. remove `display: none` from the host.


Why it's still not enough:
 - there is now the flash of no content, as I cannot block on those links,
 - (needless to mention lack of stable environment or polyfill with customized build ins)



-- 
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-371354644