- From: Tomek Wytrębowicz <notifications@github.com>
- Date: Thu, 08 Mar 2018 02:13:24 +0000 (UTC)
- To: whatwg/dom <dom@noreply.github.com>
- Cc: Subscribed <subscribed@noreply.github.com>
Received on Thursday, 8 March 2018 02:13:51 UTC
> 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
Received on Thursday, 8 March 2018 02:13:51 UTC