reactjsreduxreact-redux

How to cache API response and use it later in react & redux?


In my React based application, there is a rest API call which fetches all the data in one shot which is needed for the whole page. The response has data which can be used in a population of dropdowns as well. But I am not sure how this can be achieved. I am currently making a new request whenever the drop-down value is selected. Please do suggest me how to do implement it efficiently without making multiple unwanted rest calls.


Solution

  • you can cache in HDD or RAM.

    For localStorage you can use my little plugin for this: https://www.npmjs.com/package/localstorage-ttl

    In app state (RAM) - fire action to fetch data, use react-query or similar to make a call and save data in the app's state. Retrieve data from store.

    https://tanstack.com/query