xnimorz/use-debounce

Is this hook intended for debouncing function invocation?

Closed this issue · 3 comments

kmck commented

Hi there! I came across this library trying to find something equivalent to _.debounce but using React hooks. Something like this:

function Input({ onChange }) {
  const handleChange = useDebounce(onChange, 1000);
  return (
    <input
      defaultValue={'Hello'}
      onChange={handleChange}
    />
  );
}

After looking at the implementation, it seems like it's more like a time-based cache. Do I have that right? It might be useful to provide an example of the more commonly understood (I think?) kind of debouncing if it's possible, or a clarification to specify the intention a little more explicitly otherwise.

xnimorz commented

Hi, @kmck. Thanks for the issue

Yes, this library provides a time-based cache.

The idea to implement the more commonly understood kind of pattern is good. And I can add it tomorrow.
I'll write here when I cut the new version.

xnimorz commented

Hi, @kmck
The PR that solves your issue is here #8

I didn't publish it, as I want to add unit tests and docs for it.

But, if you want you can already use the library:

yarn add use-debounce@0.0.9-beta
xnimorz commented

I've just cut the release 0.0.9, with useDebouncedCallback method. This method is covered with unit tests.

There are examples of usage: React handlers https://codesandbox.io/s/x0jvqrwyq and native events https://codesandbox.io/s/32yqlyo815