DataTable loading slow on 200 rows

[mdimitrov94]

Hello.
I wanted to reach out regarding an issue I've encountered with the DataTable component in PrimeReact. Specifically, I've noticed significant performance degradation when using lazy loading in tables with a large number of rows.

The problem arises when the user selects more than 200 rows in lazy loading mode. At this point, the page starts to lag noticeably, and the user experience becomes less than ideal. Furthermore, when dealing with around 2000 rows, the page load time exceeds 5 seconds, which is unacceptable for most user interactions.

[melloware]

200 rows visible without paging?

[melloware]

Yes so you are loading all that data into the HTML page. So paging only displays 10-25 rows etc. But when you show 200 it is re-rendering 200 rows. The bottleneck is definitely in the UI. See these open issues: https://github.com/primefaces/primereact/labels/Type%3A%20Performance

[mdimitrov94]

so you are saying it's not certain when this will be fixed or will it be fixed at all ?

[melloware]

@mdimitrov94 i don't work for PrimeTek just an open source contributor. Ticket is open so hopefully it will be fixed but no timeline. If you need immediate support I suggest PrimeReact PRO support.

[acc-cassio]

@mdimitrov94 I have solved the issue with the selection. The PR is waiting for review, see primefaces/primereact#7425. In the meanwhile, you can clone my repo and use it in your project: https://github.com/acc-cassio/custom-primereact/