Giờ đây, các luồng chuyển đổi đã được hỗ trợ trong Chrome, Safari và Firefox, cuối cùng các luồng này đã sẵn sàng cho giờ vàng!
API Luồng cho phép bạn chia nhỏ tài nguyên mà bạn muốn nhận, gửi hoặc chuyển đổi thành các phần nhỏ, sau đó xử lý các phần này từng phần một. Gần đây, Firefox 102
đã bắt đầu hỗ trợ TransformStream,
điều đó có nghĩa là TransformStream hiện là
dễ sử dụng trên các trình duyệt. Việc chuyển đổi luồng cho phép bạn chuyển hướng từ một
ReadableStream thành một
WritableStream, thực thi một
biến đổi trên các phần hoặc trực tiếp sử dụng kết quả đã biến đổi,
như trong ví dụ sau.
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;
}
});