1 · The .next() Stepper

Click next() to advance the generator one step. Watch execution pause at each yield, the returned { value, done }, and how local state survives between calls.

value: —
done: —
count (state): 0

2 · Lazy Pipeline — filter → map → take

Numbers flow through the pipeline one at a time. Click step to pull the next value lazily: keep evens → square them → take 5. No intermediate arrays are built.

naturals()→ filter(even)→ map(x²)→ take(5)
Source values examined
Output (collected)

3 · Blocking Loop vs Cooperative Generator

Both process the same heavy workload. The blocking loop freezes the UI (the spinner stops!). The generator yields control between chunks, so the spinner keeps spinning and progress updates.

❌ Blocking loop

Progress: 0%

✅ Cooperative generator

Progress: 0%