DEV Community 👩‍💻👨‍💻

Discussion on: Debouncing with React Hooks

eransakal profile image
Eran Sakal

Thanks for the article. I'm curious about the chosen approch of providing a value to the custom hook that gets updates over time.

export default function useDebounce(value, delay) {

Here we listen to value changes in the custom hook with the inner useEffect and react to changes. Most of the hooks I'm familiar with treat the arguments they get as sort of initialization values that doesn't change overtime or even if changed are not monitored. For example useState, useReducer, useSelector, useMemo, useCallback, useRef are all hooks that doesn't react to changes of the initial values provided to the hook.

I know that your sample works and is valid implementation but I'm sure if it will not confuse developers who read the code. you could easily expose a second argument to update the value which will look very similar to useState


skyboyer profile image
Yevhen Kozlov

useCallback, useSelector, useMemo, useReducer are actually operating on most recent arguments each run.
It's only useState and useRef who purposely ignore any changes on sequential calls