debounce と throttle の React Custom Hooks を実装してみる - もやし丸の備忘録throttle や debounce は連続して大量に繰り返される処理を間引いて負荷を軽減させたりするときに使います。 今回はそれらの間引き処理を React Hooks で実装してみました。 react-use に useDebounce と useThrottle が実装されているので自前で実装する必要性を感じない方はそちらを使用すると良いと思います。 github.com throttle, debounce とは？ throttle 連続して大量に繰り返される処理を一定感覚で間引く。 scroll イベントでよく使用される。 debounce 連続して大量に繰り返される処理が指定時間内に何度発生しても最後の1回だけ実行する。 resize イベント、インクリメンタルサーチなどで使用される。 実装してみる codesandbox.io 間引く間隔はデフォルト1秒に設定しています。
React useThrottle hook with usage example
