The visible problem may look like one API or tuning value, but reliability is decided by state ownership, resource bounds, and recovery after failure. Virtualization reduces DOM by recycling and unmounting rows. Index keys, unstable height measurement, and prepends can move scroll position and focus.
Frontend architecture is about state ownership, repeatable events, invalidation of stale async work, and cleanup after unmount—not the shape of the source directory.
Make the implementation decisions explicit
Write the following choices as reviewable rules instead of scattering them across callbacks and UI conditions. Explicit rules make scaling, compatibility, and diagnosis less dependent on guesswork.
- Use entity IDs as keys and separate rendering windows from data order.
- Anchor the visible item and offset before prepend, then restore after update.
- Provide total and position semantics plus an accessible paged or searchable alternative.
Virtualization succeeds when position, focus, and identity remain stable at scale—not merely when scrolling reaches a frame-rate target.
Failure paths that are easy to miss
Production failures often appear when two individually valid actions overlap. Inspect stale messages, duplicate effects, exhausted resources, and mixed versions instead of patching only the current stack frame.
- Filtering reuses stale height measurements and accumulates scroll error.
- A focused row unmounts offscreen and keyboard navigation returns to the page top.
- Every live event sorts the whole dataset, so reactive work overwhelms DOM savings.
How to verify it before release
A release gate combines deterministic regression, randomized timing, and real browser pairs. Preserve the seed and state trace from every failure as a permanent replay case.
- Append, prepend, delete, and filter while preserving anchor and focused entity.
- Test dynamic height correction under font zoom and long Chinese and English titles.
- Measure DOM count, long tasks, and memory while completing record lookup accessibly.
A capability becomes maintainable when it degrades safely, repetition adds no side effects, and its signals reveal a fault before user reports do.