DEV Community

Discussion on: Debouncing with React Hooks

Collapse
 
gnbaron profile image
Guilherme Baron

Great article!

I've been using this pattern with hooks lately:

const [value, setValue] = useState()
const debouncedValue = useDebounce(value, 800)
Enter fullscreen mode Exit fullscreen mode

It's clean and works well for most of the cases.

Here's a version useDebounce implemented using lodash: github.com/gnbaron/use-lodash-debo...

Collapse
 
haraldson profile image
Hein Haraldson Berg • Edited

Here’s my take on a lodash.debounce hook. I don’t see why the hook shouldn’t be more convenient to use, so I basically made a useState wrapper which updates the value immediately (a requirement for controlled inputs), and updates a signal, which is meant to be used in a useEffect’s dependency array, only whenever specified as per lodash.debounce’s docs.