useDeepCompareEffect doesn't work

[GarasChan]

What is the current behavior? useDeepCompareEffect doesn't work while the deps is a map object;

Steps to reproduce it and if possible a minimal demo of the problem. Your bug will get fixed much faster if we can run your code and it doesn't have extra dependencies other than react-use. Paste the link to your JSFiddle or CodeSandbox example below: https://codesandbox.io/s/distracted-fire-zze9b?file=/src/App.js

What is the expected behavior?

A little about versions:

• OS:
• Browser (vendor and version):
• React:
• react-use:
• Did this worked in the previous package version?

[juliolmuller]

Taking a look at the source code, I realize that useDeepCompareEffect uses the dependency fast-deep-equal to compare Map instances. This wouldn't be a problem in most cases, however the output when comparing these ES6 API's fail as there is no specific comparison logics for instances of Map or Set. Instead, the fast-deep-equal/react that is used ends evaluating 2 different instances of Map as equal.

The solution I propose (and which is recommended in this fast-deep-equal's thread) would be to utilize the fast-deep-equal/es6/react instead, so there are proper comparisons for ES6 API's.

/* /src/misc/isDeepEqual.ts */
- import isDeepEqualReact from 'fast-deep-equal/react';
+ import isDeepEqualReact from 'fast-deep-equal/es6/react';

export default isDeepEqualReact;

However, I understand this change maybe an undesired breaking change, specially if the project wants to support natively (without polyfills) pre-ES6 projects.

Besides, changing the import would also affect the hook useBattery, that also uses deep comparison in its implementation.

[juliolmuller]

@ChenGuanglin0924, until ES6 objects are not supported, I would recommend you to stick to the old and good JS object as state, if it is possible for your use case, of course.

[sKopheK]

fast-deep-equal also causes "Maximum call stack size exceeded" error when object has circular dependencies; the author says there's no way to fix it. ~when using dequal instead as, for example, https://github.com/sandiiarov/use-deep-compare/ does, the error does not happen~

EDIT: happens also, but with different objects :)