cloudscape-design / components

React components for Cloudscape Design System
https://cloudscape.design/
Apache License 2.0
2.33k stars 152 forks source link

Table component Requirement of infinite scroll with less rendering like react window #2608

Open IamGauravSaini opened 3 weeks ago

IamGauravSaini commented 3 weeks ago

Description

hey there we our using cloudscape table component and we are facing problem as the table components start slowing down when we load Data of 30 rows or more and as the number of rows increase it get more slower so we want if you guys can provide us with a feature of infinite scroll with rendering of only those rows which are in viewport like react-window(as we Can't use pagination )

Code of Conduct

YueyingLu commented 3 weeks ago

Hi @IamGauravSaini thanks for the request. Have you checked expandable table with progressive loading? See example here https://cloudscape.design/examples/react/table-expandable.html. With it you can load a set of number of data at one time.

IamGauravSaini commented 3 weeks ago

Hello @YueyingLu thanks for replying. I have checked that already but it do not matches my requirement as i have large no. of row which need to be rendered and if i render them all at once or render more then 30 rows it slows down the table component so i want way like (react virtualized list) so that it will only add 10 to 20 rows to the DOM and as i scroll down it will add next row to the bottom and remove top row simultaneously so that it will not increase load to the DOM .

YueyingLu commented 2 weeks ago

Hi @IamGauravSaini we currently do not have virtualised list in Table support planned. There are some concerns like a11y of this feature.

Could you share more information of your use case, to understand why progressive loading can not help you? Why you have to render at once, but not to load and render items incrementally?