Performance on the large tables

[petrvecera]

Hello guys

We have a tabel which has ~20 columns and about 700 rows.

If we render this table on the whole page is semi-OK, few lags when you open the page.
But when we render the page in the set height / width - so it has scrollbars - when you scroll it lags.

We tried to mitigate this by adding pagination to the table. Which helps to some extend. But the table sometimes still lags.

Just wondering is someone come across this - maybe we have something incorrectly implemented 🤷

The page in question https://coh-stats-coh3-stats-improve-weapons-table.edge.edgio-perma.link/explorer/weapons

[lukasbash]

This is not even related to "large" tables. Having 100 rows and any parent component which might cause dense render cycles (e.g. any resizing library out there) cause the table to render each cell multiple times. This causes massive load inside react.