dfkaye · August 18, 2024 08:17
diff --git a/chunked-response-stream.js b/chunked-response-stream.js
 // 15 July 2024
 // simulate chunked HTML response stream in the browser


 // 1. create the response stream parts

 var encoder = new TextEncoder;

 var text = `
 <html lang="en">
 <head>
  <title>test streaming response test</title>
 </head>
 <body>
  <header>
    <h1>heading</h1>
  </header>
  <main>
    main
  </main>
  <footer>
    footer
  </footer>
 </body>
 </html>
 `
 .trim();

 var parts = text.split("\n");

 var stream = new ReadableStream({
  start(controller) {
    parts.forEach(part => {
      controller.enqueue(encoder.encode(part));
    });

    controller.close();
  }
 });

 var response = new Response(stream);


 // 2. process the response stream chunks

 var reader = response.body.getReader();

 var decoder = new TextDecoder;

 var doc = document.implementation.createHTMLDocument();

 // doc = document

 doc.open();

 reader.read().then(function next({ done, value }) {
  if (done) {
    doc.close();
    console.warn(doc.documentElement.outerHTML);
    return;
  }

  // process value
  // console.log(decoder.decode(value));
  doc.writeln(decoder.decode(value));
 	
  // get next value
 	reader.read().then(next);	
 });
	// 15 July 2024
	// simulate chunked HTML response stream in the browser


	// 1. create the response stream parts

	var encoder = new TextEncoder;

	var text = `
	<html lang="en">
	<head>
	<title>test streaming response test</title>
	</head>
	<body>
	<header>
	<h1>heading</h1>
	</header>
	<main>
	main
	</main>
	<footer>
	footer
	</footer>
	</body>
	</html>
	`
	.trim();

	var parts = text.split("\n");

	var stream = new ReadableStream({
	start(controller) {
	parts.forEach(part => {
	controller.enqueue(encoder.encode(part));
	});

	controller.close();
	}
	});

	var response = new Response(stream);


	// 2. process the response stream chunks

	var reader = response.body.getReader();

	var decoder = new TextDecoder;

	var doc = document.implementation.createHTMLDocument();

	// doc = document

	doc.open();

	reader.read().then(function next({ done, value }) {
	if (done) {
	doc.close();
	console.warn(doc.documentElement.outerHTML);
	return;
	}

	// process value
	// console.log(decoder.decode(value));
	doc.writeln(decoder.decode(value));

	// get next value
	reader.read().then(next);
	});