Skip to content

Out of Order Streaming using Declarative Shadow DOM

~1 min read

A new technique that requires no JavaScript

Saw this tweet from @passle_ and thought this was pretty dang clever. He goes on to explain the relatively simple technique:

		<template shadowrootmode="open">
			<h1>Hello world</h1>
			<slot name="id-1">
		<div slot="id-1">
			Content loaded!

So, when the HTML document above is streaming into the browser, the children of <slot name="id-1"> will be displayed until the <div slot="id-1"> is streamed in! How cool is that?

Share this post

📧 Email