You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Hello!
First of all thanks for the library, I'm using it since ages and it's an amazing one.
I think I've found a possible issue, let me try to explain it:
The shouldUpdate function is used to check wether the component will rerender with a new value, the problem is that if the cookie is an object (e.g. {"key": "value"}) that shouldUpdate function will always return true as the === will always resolve to false because the object references are going to be different between cookie reads.
This may seem not a problem, but, every time one cookie change (let's call it cookie-1), all the listener of useCookies occurrences will fire, so if I used three times useCookies in my app, like:
All three 'listeners' will fire, and the shouldUpdate function will run three times (as expected).
The problem is that, if cookie-2 or cookie-3 are object values, that shouldUpdate function will return true and cause a re-render of the component, even if we actually just changed cookie-1
I'm happy to open a PR to fix this, if you agree with me this is an improvement.
The text was updated successfully, but these errors were encountered:
albertodeago
changed the title
Unexpected re-renders when the saved cookie as an object value
Unexpected re-renders when the saved cookie is an object
May 15, 2024
Hello!
First of all thanks for the library, I'm using it since ages and it's an amazing one.
I think I've found a possible issue, let me try to explain it:
The shouldUpdate function is used to check wether the component will rerender with a new value, the problem is that if the cookie is an object (e.g.
{"key": "value"}
) that shouldUpdate function will always returntrue
as the===
will always resolve to false because the object references are going to be different between cookie reads.This may seem not a problem, but, every time one cookie change (let's call it
cookie-1
), all the listener ofuseCookies
occurrences will fire, so if I used three timesuseCookies
in my app, like:All three 'listeners' will fire, and the shouldUpdate function will run three times (as expected).
The problem is that, if
cookie-2
orcookie-3
are object values, thatshouldUpdate
function will return true and cause a re-render of the component, even if we actually just changedcookie-1
This is a repo to easily reproduce it, the readme have all the steps to do it:
https://github.com/albertodeago/react-cookie-repro-obj
(I created the repro with next.js because it was faster, but it's not next.js related)
I'm happy to open a PR to fix this, if you agree with me this is an improvement.
The text was updated successfully, but these errors were encountered: