Debouncing updates produces weird behaviour

Using the hook returned from createLocalStorageStateHook produces weird behavior when debouncing updates.

Using a controlled input, with debouncing using a useEffect, the updates eventually propagates to all components (not always all) using the state.

Using an uncontrolled input, with normal debouncing, the updates seemingly propagates randomly to the components using the state.

LocalStorage is always updated.

We’ve simplified our case and created a reproducible example in this codesandbox:
https://codesandbox.io/s/use-local-storage-state-debounce-u3p7m?file=/src/App.tsx

I’ve quickly gone through the source for use-local-storage-state, and can’t find anything to indicate this should happen. I’m wondering if we’ve hit some limitation of React or something.

[astoilkov]

I fixed the issue and released an update. Thanks for the time to report and investigate the issue!

[astoilkov]

Thanks for reporting this and all the detailed information. I think I should fix this. It’s both slow and buggy for React 17 which I believe will be popular for some more time. At some point, I will remove it.