HN Explorer

2 comments

[ 4.8 ms ] story [ 15.0 ms ] thread
aprilnya
If I'm understanding correctly, the TLDR is

    <template shadowrootmode="open">
        <slot name="thing">Loading...</slot>
    </template>

    <!-- then, later, at the end, with streaming -->
    <div slot="thing">Content</div>
and the <slot> with name="thing" will get replaced by the <div> with slot="thing"? This is really cool
niutech
Yes it is. And it is supported by all modern browsers (https://caniuse.com/declarative-shadow-dom), for older browsers you can add a tiny polyfill. Keep in mind that you need to link CSS stylesheet inside Declarative Shadow DOM or use CSS ::part() from outside of it.