I need to be able to display a pagination of 200 rows in my table. I have page sizes of 25, 50, 100 and 200.
The performance of the grid is acceptable when it renders only text, even for a page size of 200 rows.
But sometimes, I need to render custom cells... I tried using both approaches of column templates and queryCellInfo method. I find the performance of queryCellInfo acceptable at 25 and maybe 50 rows. But it is slow at 100 rows (3-4 seconds for rendering only) and very slow at 200 rows (+7 seconds for rendering). For column templates it is even worse, it takes like double the time of queryCellInfo.
My custom templates vary between a simple icon and a button with click handler.
Is this performance expected or am I doing something wrong?
I also had a look at virtualization as a solution for this issue, but I need to display the pagination in my table. I don't think both pagination and virtualization can be implemented at the same time. correct?
PSPavithra Subramaniyam Syncfusion Team December 8, 2022 12:41 PM UTC
Hi Amr Fekry,
While using more template
columns and more rows, each custom template component takes considerable time
to render in the DOM. So, if you increase the pageSize (for ex, 100, 500, All),
then the grid takes considerable time to render each cell including the
template columns in the DOM. This is the default behavior of the Grid component.
If you are using more number columns and template columns in the Grid, we
suggest setting the pageSize below 50 for better performance.