FAM - Chrome Dev Summit 2016 snippet

future-app-model-a.js

const response = await fetch(url);
const reader = response.body.getReader();

while (true) {
  const {done, value} = await reader.read();
  if (done) 
    break;
  // Do something with value otherwise
  console.log(value);
}

future-app-model-b.js

const response = await fetch(url);

for await ( const value of response.body ) {
  console.log(value);
}

// We get bytes back
// [ 72, 101, 108, .... ]
// [ 121, 111, ....]
// [ 113, 12, ...]

future-app-model-c.js

const response = await fetch(url);
const decoder = new TextDecoder();

for await ( const value of response.body ) {
  console.log(
    decoder.decode(value, {stream: true})
  );
}

// We now get text
// Hello everyo
// ne How are y
// .....

future-app-model-d.js

const transform = new TransformStream({
  start(controller) {
    // ...
  },
  
  transform(chunk, controller) {
    // ...
  },
  
  flush(controller) {
    // ...
  }
});

const {readable, writable} = transform;

future-app-model-e.js

const response = await fetch(url);
const stream = response.body.pipeThrough(new TextDecoder());

for await ( const value of stream ) {
  console.log(value);
}