# Virtualized scrolling
The virtualized scrolling is a central part of any datagrid - without it the component is simply not capable of displaying more than a few thousands rows, otherwise the page becomes slow and unresponsive. Virtualized scrolling works by rendering only the visible rows and adding/removing extra rows on the fly while the content window shifts up/down.
While that sound simple there are many technical challenges to making virtualized scrolling feel smooth and natural. First, the time it takes the browser to recalculate the styles, compute the layout and render full-page datagrid usually exceeds 16 ms - the frame duration at the typical 60 frames per second refresh rate. And on top of that we need to retrieve rows data, format cell contents, build corresponding DOM nodes, assign classes, styles and attributes, plus all that diffing/checking or whatever reactivity algorithm your framework uses until it comes down to the final rendering layer.
After lots of testing of various scrolling techniques we believe the one which works best is using CSS transforms to move the scrolled content. The advantage of this implementation is that scrolling is GPU-accelerated and runs in a separate composer thread not affected by scripting and rendering of the new rows. The other important part is that adding/removing rows does not trigger the styles and layout recalculation of the whole page - only the affected rows. We also spread the work into multi-frame cycles so that 16ms single frame limit is never exceeded.
# Vertical
The vertical scrolling is fully virtualized and switched on by default - you don't need any configuration setting to activate it.
# Horizontal
The horizontal scrolling is also using CSS transforms but it is not virtualized yet. This part is in development and will be released soon.