Transform streams

Problem

What becomes confusing, fragile, or impossible without understanding transform streams? This lesson answers that through explanation, a worked example, two runnable exercises, and a reference solution. No teacher-supplied worksheet is required.

Event loops let one thread coordinate many delayed operations. Promises standardized continuation and error composition over callback-heavy code.

Concept explanation

Transform streams belongs to “Cancellation, streams, backpressure”. transform streams must be connected to layer below by tracing representation, ownership, control, and failure. Cancellation and backpressure are policies connecting producers, consumers, cleanup, and bounded memory.

For transform streams, trace concrete input, state transition, output, and failure through a state-and-time rule spanning synchronous frames, host tasks, microtasks, rendering, cancellation, or backpressure.

Synchronous frames run to completion. Hosts schedule tasks; promise reactions enter microtask queues; rendering occurs only at host-selected opportunities. Apply that model to supplied normal, boundary, and failure cases; each case below names its input and expected evidence.

Example bank

Compare normal, boundary, failure, and cross-layer cases. Predict each observation before revealing the explanation.

Worked example

Start from supplied lab.mjs. Focus: Trace transform streams end-to-end while running: Stream numbered chunks through transform to slow writable with AbortSignal.

1. Run: node lab.mjs
2. Save baseline evidence. Record ordering, async stacks, queue delay, cancellation signals, stream state, and cleanup paths.
3. Boundary case: At every transform streams boundary, label owner and representation during: Compare desiredSize and memory with fast versus slow consumer.
4. Failure case: Locate first layer where evidence diverges during: Abort mid-stream and prove every resource closes once.

RESULT
Trace explains Bounded flow honors pressure; abort reason propagates; cleanup trace has no duplicate or leaked ownership. without skipping any conversion, queue, process, protocol, or storage boundary. Starter-level baseline: Order ends as sync:start > sync:end > microtask > task. Each line is a prefix of that final sequence.

Starter material

Create lab.mjs, paste this exact content, then run the command below.

const events = [];
const record = (value) => { events.push(value); console.log(events.join(" > ")); };

record("sync:start");
queueMicrotask(() => record("microtask:transform streams"));
setTimeout(() => record("task:transform streams"), 0);
record("sync:end");

STOP / CLEANUPScripts exit after queued work completes. Press Ctrl+C only if your experiment creates an intentional infinite loop.

Independent exercise

Remove one abstraction: transform streams

1. Create second case from blank file: At every transform streams boundary, label owner and representation during: Compare desiredSize and memory with fast versus slow consumer.
2. Then create controlled failure: Locate first layer where evidence diverges during: Abort mid-stream and prove every resource closes once.
3. Use Chromium Performance · Network · async debugger to prove behavior, then repair controlled failure.
4. Compare result against supplied acceptance checks and reference approach before marking complete.

Expected result

• Trace explains Bounded flow honors pressure; abort reason propagates; cleanup trace has no duplicate or leaked ownership. without skipping any conversion, queue, process, protocol, or storage boundary.
• Order ends as sync:start > sync:end > microtask > task. Each line is a prefix of that final sequence.
• Controlled transform streams failure produces captured evidence; repair restores stated invariant without hiding error.

Hints

Solution

Attempt both exercises before opening reference approach.