Request an image, read image data, and create blog url for an image.

blog-image-readable-stream.js

(async function() {
  // Request
  let response = await fetch('https://upload.wikimedia.org/wikipedia/commons/thumb/7/77/Google_Images_2015_logo.svg/1200px-Google_Images_2015_logo.svg.png');

  // Reader
  let reader = response.body.getReader();
  
  // Final Image Data
  let imageData = [];

  // Readable Steam
  new ReadableStream({
    start(controller) {
      function push() {
        reader.read().then(({value,done}) => {
          if (done) {
            // Create Blob
            let blob = new Blob(imageData, {
              type: "image/png"
            });

            // Create Image
            let image = new Image();
            
            // Set Blob src
            image.src = (window.URL || window.webkitURL).createObjectURL(blob);

            // Append DOM
            document.getElementById("append").append(image);

            // Close Stream
            controller.close();
            return;
          }

          // Push image data
          imageData.push(value);

          // Push data
          controller.enqueue(value);

          // Recursively push data
          push();
        });
      }
      // Init
      push();
    }
  });
})();