The <ReactDataGrid /> is designed from the ground-up to be very fast and efficient with big datasets. If you can fit a dataset into the browser without making it freeze, then handling it through the <ReactDataGrid /> will be by no means worse.
Besides being able to render huge amounts of data (and therefore very many rows), the grid is also built to support a big number of columns. Although in most cases 10 columns or less are enough, the <ReactDataGrid /> can handle about 50 columns quite easily.
In order to make the component fast while handling and displaying so much data, virtualization has been used extensively. Virtualization is used for both the rows and for the columns (in case there are many columns).
<ReactDataGrid /> peformance mostly refers to how the <ReactDataGrid /> behaves & updates while scrolling - since this is the most performance-sensitive operation one can do with a <ReactDataGrid />.
In case you run into a performance issue, the first thing you need to check is whether you're updating <ReactDataGrid /> props unnecessarily.
To boost performance of the <ReactDataGrid />, we treat props as immutable and only update the <ReactDataGrid /> when you pass different props.
So for example, to improve the rendering performance, make sure you pass the same reference to a
dataSource when rendering the
<ReactDataGrid />, instead of building the dataSource in the render function of your app and passing it new each time to the
<ReactDataGrid />, even when the
dataSource doesn't change.
If the performance issue still persists, you might try to increase the default
rowHeight. The less rows fit into the viewpot, the snappier the
<ReactDataGrid /> is.
In case you have many columns, and the <ReactDataGrid /> performs column virtualization, try increasing the widths of <ReactDataGrid /> columns in order to improve performance. The less columns fit into the viewport, the snappier the <ReactDataGrid /> is.