CODEWITHSUNDEEP
reactjsredux
d.alexandr
d.alexandr

Reputation: 1

Use 'state' with redux for the 'big' data

I want to do the following: when user connect to personal cabinet, his get all data(array ~5000 rows), these data will be stored in state 'allOrders' and will be updated (every minute) only when was added new orders (I use websockets). It is normal practice (stored in state 'big' data) or better do differently?

Upvotes: 0

Views: 433

Answers (1)

John
John

Reputation: 2894

I've found when you get into the thousands of items, working with data in the browser can be slow. Even if you optimize the rendering, you will likely want to do filtering and sorting to better visualize the data, and simply iterating through 5k items with a .filter or etc will noticeably affect the responsiveness of your UI, and feel sluggish.

Your alternative is to work with the data server side and this of course introduces network latency which also tends to impact performance; basically it's unlikely that you will be able to work with a dataset this large without making the user wait for certain operations. Working with the data in the browser however will make the browser appear to 'hang' (ie not respond to user actions) during large operations which is worse than waiting on network latency, which will not lock up the browser.. so there is that.

I've had success working with https://github.com/bvaughn/react-virtualized when rendering large lists. It's similar to the lib you mentioned, in that it only renders what is in view. You definitely do not want to try to render 5k things.

Upvotes: 1

Related Questions