Yield in the wrong place

Two copies of the same search-as-you-type page over 10,000 books. A Claude Code agent wrote the first one after retrieving Modern Web Guidance's break-up-long-tasks guide. The second changes one condition so it inserts the list in batches of 200 and yields between them.

• Slow: the agent's page. Yields on a 50 ms deadline that only times string building, so the yield never runs before the one big insert.
• Fixed: one condition changed. Inserts 200 items, yields, repeats.

-    if (performance.now() >= deadline) {
+    if (++count % 200 === 0) {

Open one, type a single letter like a, then a few more, and watch the meter in the corner. It counts summed long-task blocking (the part of each task over 50 ms) and the worst interaction, from your first keystroke. On a fast machine the gap is small; turn on CPU throttling in DevTools (Performance panel, 4x) to see what the test measured.

Measured in headless Chrome 156 at 4x throttle with a fixed typing script: the slow page blocked for a median 2,760 ms with a worst interaction of 1,344 ms; the fixed page 578 ms and 336 ms. The meter is added for this demo only and wasn't on the measured pages. Method and data: the repo.