How to deal with React and API?

JavaScript
#1

I’m building a React app that gets its data from a local API. The data is just an array with about 500 objects. The app has different views, each of them requiring a different subset of the array. How would you structure API and app? I have two ideas:

  1. The app gets the data once from a unique API endpoint, and filters the data each time a view loads. Pros: simple API. Cons: more processing of data each time a view loads.

  2. Each app view has its own API endpoint, so to get the data for a view it just fetches the whole data from that API endpoint. Pros: less processing of data each time the view loads. Cons: more complicated API, and more fetching of API data.

What would you recommend?

#2

Do the first one, API calls are what take time, once you’ve got the data everything is fast. If you need to do work on the data, then use context or Redux. And to further optimise, you can process the data into the shapes you want it just after you make the API call, and shove the the different shapes into context/Redux. Then the rest of the app would just be dumb rendering of that data, no further processing.

#3