Execution — fw-10-virtual-list

Steps extracted from CONCEPTS.md. Read the concepts first; this file is the doing.

Record results in observation.md; tick checkpoints in verification.md.

2. Build order

Render 100,000 logical rows with a small DOM window.

  1. Fixed heights: viewport → visible index range → render window + overscan.
  2. Absolute positioning or transform offset for the window. Choose deliberately and justify it from bi-09.
  3. Dynamic heights: measure rendered rows, cache measurements, correct the estimate.
  4. Scroll anchoring: keep the visually-anchored row stable when an above-viewport measurement changes.
  5. Fast scroll: what to show when you outrun measurement.
  6. Accessibility: what a screen reader sees when only 20 of 100,000 rows exist.

3. Failure Lab

  1. Measurement thrash. Measure every row every frame. Watch forced synchronous layout (bi-08).
  2. Anchor drift. Skip scroll anchoring; watch content jump as heights resolve.
  3. Overscan zero. Blank rows on fast scroll — the app-level analogue of checkerboarding (bi-10).
  4. DOM growth leak. Recycle rows incorrectly so the DOM grows; find it in a heap snapshot.
  5. Scroll handler on the main thread. Update the window in a scroll handler; measure the one-frame lag. Compare an IntersectionObserver/sentinel approach.