Streaming HTML out of order without JavaScript

Streaming HTML out of order without JavaScript

A really interesting new browser capability. If you serve the following HTML:

<template shadowrootmode="open">
<slot name="item-1">Loading...</slot>
</template>

Then later in the same page stream an element specifying that slot:

<span slot="item-1">Item number 1</span>

The previous slot will be replaced while the page continues to load.

I tried the demo in the most recent Chrome, Safari and Firefox (and Mobile Safari) and it worked in all of them.

The key feature is shadowrootmode=open, which …

browser browsers capability element html javascript loading page serve streaming template webcomponents will