DataTable - row selection lag with large dataset

[omzy]

Hi all,

I am experiencing a performance issue when using the row selection feature with a large dataset. Here is a demo to illustrate the issue:

https://stackblitz.com/edit/prncz5-ujukub?file=src%2FTable.vue

On a table with 500 rows (basic table, no additional features), it takes around 2 seconds to register a tick on an individual row. It takes over 20 seconds to register a tick on the "select all" checkbox, sometimes even causing the browser to crash.

I noticed there is an open issue for this already: primefaces/primevue#4020

Someone in the comments mentioned a workaround by removing the 2 way binding on the selection field, but I was unable to achieve this.

I was wondering if anyone has any ideas on how I can apply a temporary workaround until the devs get around to fixing this bug?

[tugcekucukoglu]

Hi,

We recommend lazy loading for better performance. With lazy loading, data size does not matter.

[omzy]

@tugcekucukoglu thanks for your reply. I have just had a look in to the "lazy load" option, but I am not entirely sure how this is going to help for my scenario. From my understanding, it will allow faster loading of data when using features such as pagination, filtering and sorting, since you can perform an AJAX request, for example, to fetch this data.

However, in my scenario I need to load a large dataset (for example 500 rows), in one go, so that a user can select all rows and then perform an action on the selected rows.

[MiguelBamberino]

I have also tried to solve this problem by using a DataTable with VirtualScroll. However there is still lag problems when clicking "select all", it takes several seconds for the render to trigger. We also noticed that, once you've selected all rows, that VirtualScroll really struggles to render the next block of ticked rows. You get big blocks of white that take a a few seconds to render.

[MiguelBamberino]

Hi,
Is there an update on this issue ? We can't use lazy load, because our users would need to click "select all" and for that to be applied on >250 rows. So we would need those 250 rows in memory (standard view / VirtualScroll view)