Da Umwandlungsstreams jetzt in Chrome, Safari und Firefox unterstützt werden, kann es endlich losgehen!
Mit der Streams API können Sie eine Ressource, die Sie empfangen, senden oder umwandeln möchten, in kleine Einheiten aufteilen und diese Teile dann Stück für Stück verarbeiten. Seit Kurzem wird TransformStream
in Firefox 102 unterstützt. Das bedeutet, dass TransformStream
jetzt endlich browserübergreifend verwendet werden kann. Mit Transformationsstreams können Sie eine Pipe von einem ReadableStream
zu einem WritableStream
ausführen, eine Transformation für diese Blöcke ausführen oder das transformierte Ergebnis direkt verwenden, wie im folgenden Beispiel gezeigt.
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
Unterstützte Browser
Teil der Reihe zur neuen Interoperabilität