🚀 Virtual Scrolling Demo
Render thousands of items smoothly. Only visible items are in the DOM. Scroll the
masonry below to see virtualization in action.
2,000 Total Items
~14 Rendered
0px Width
ON Virtual
How it works
- Per-column virtualization — Each column independently tracks
visible items
- Binary search — O(log n) lookup for visible range using cumulative
heights
- Padding spacers — Culled items replaced with padding to maintain
scroll position
- ResizeObserver — Visible items measured; heights cached for
accurate positioning
- Height estimation — Uses
getEstimatedHeight before
measurement