React Cookie doesn't work with async response

1k Views Asked by At

Hello I am working on a React application (an e-commerce). I noticed that when I try loading all the product on a first render, it takes about 9 seconds (Load time is similar to what I got on Postman as well). However, I am trying to improve the load time by caching the data in a cookie so I decided to try out React-Cookie library. However, I noticed that when I tried to save the response data from my API call (asynchronous), My cookie doesn't get set with the data but it works well with hard-coded synchronous value. I have looked through the React-cookies documentation and I couldn't find any solution to this problem. Any suggestion or pointer to how this issue can be solved would be greatly appreciated. Thank you.This is for the async data This is for the hard-coded synchronous dataThis is the component where the two functions are called This is what is available in my browser cookie Response Data

1

There are 1 best solutions below

1
On

The maximum size of a cookie is 4096 bytes. Besides that, if you use cookies, your cookie data will go to the server for every request.

You may use local storage or session storage. If you use Redux, you can use https://github.com/rt2zz/redux-persist