TransformStream kini didukung lintas browser

Setelah didukung di Chrome, Safari, dan Firefox, streaming transformasi kini siap digunakan.

Streams API memungkinkan Anda membagi resource yang ingin diterima, dikirim, atau diubah menjadi potongan-potongan kecil, lalu memprosesnya sedikit demi sedikit. Baru-baru ini, Firefox 102 mulai mendukung TransformStream, yang berarti TransformStream kini akhirnya dapat digunakan di seluruh browser. Aliran transformasi memungkinkan Anda melakukan pipeline dari ReadableStream ke WritableStream, menjalankan transformasi pada potongan, atau menggunakan hasil yang diubah secara langsung, seperti yang ditunjukkan pada contoh berikut.

class UpperCaseTransformStream {
  constructor() {
    return new TransformStream({
      transform(chunk, controller) {
        controller.enqueue(chunk.toUpperCase());
      },
    });
  }
}

button.addEventListener('click', async () => {
  const response = await fetch('/script.js');
  const readableStream = response.body
    .pipeThrough(new TextDecoderStream())
    .pipeThrough(new UpperCaseTransformStream());

  const reader = readableStream.getReader();
  pre.textContent = '';
  while (true) {
      const { done, value } = await reader.read();
      if (done) {
        break;
      }
      pre.textContent += value;
  }
});

Demo

Dukungan browser

Bagian dari Rangkaian yang baru dapat dioperasikan