ReadableStream

From MDN:

The ReadableStream interface of the Streams API represents a readable stream of byte data. The Fetch API offers a concrete instance of a ReadableStream through the body property of a Response object.

A prime use-case for ReadableStream is as the content of a Response object. This enables developers to construct a streaming response and serve this to the browser through a Service Worker.

This is the core functionality of this app.

ReadableStream is supported by all modern browsers.

In this demo, the header, footer and content are fetched as separate templates. All template responses have a body property which exposes the underlying stream. For each of these streams we get a reader.

Then, a new ReadableStream is constructed that is immediately returned to the browser. When the readers of the individual template streams return a chunk, this is enqueued in the new ReadableStream which then immediately serves that content to the browser.