react-pirate icon indicating copy to clipboard operation
react-pirate copied to clipboard

fix(useInterval): use a memoized function

Open ckknight opened this issue 6 years ago • 2 comments

By memoizing the function via useCallback within useInterval, coupled with the explicit cache of [] (meaning that the effect only has an onMount and onUnmount), only a single interval is kept for the lifecycle of the component, that will be appropriately called with updated props/state.

ckknight avatar Nov 02 '18 23:11 ckknight

I believe a similar approach should be taken with useTimeout, but it's quite viable that one might want to be able to "reset" a timeout such that within a single component's lifecycle, the timeout might fire more than just X ms after mount. It's also possible in that case that one might want to use a different cache than either [] or undefined.

ckknight avatar Nov 02 '18 23:11 ckknight

I ran some tests in a sandbox and both behaviours are not quite perfect. I tried by pushing the memFn into the array of useEffect and it seems to work better : https://codesandbox.io/s/olzln0z4oq

What do you think ?

dispix avatar Nov 03 '18 10:11 dispix