Search code examples
reactjswebsocketreact-reduxpolling

Should I fetch all data at once and save it in the state?


I am currently implementing pagination for a list of users(just an example). One approach is to fetch users by page. This means that I pass something to the API so that it would return a set of users that corresponds to the current page. Another approach is to fetch all users, save it in the state, and do all the computation(number of pages, etc) in React.

In the next days, I am planning to implement polling(I am new to this, btw) so the data is always up to date whenever there is a change in the database records.

I would like to ask your opinion as to which method should I go? I am not sure which is better combined with polling as I am relatively new to it. I am concerned that if I fetch all users then do polling, it might consume a lot of memory and cause the browser to crash.


Solution

  • It would be better to fetch users by page as that will cause minimum data to be transferred between server and client. You can fetch data as and when required. When the first page is loaded you can save that to state and when the second page is loaded you can append that to the state (so that you don't have to fetch the entire data again). It does not make sense to get all the data upfront since it will cause you increased load times (especially since you talked about immense amount of data that can cause the browser to crash). If you have that much amount of data you can replace the state with new data also.