import { useCallback, useRef } from 'react'; export default function useDebounce(callback, delay = 400) { const debounce = useRef(null); return useCallback( (...args) => { const context = this; clearTimeout(debounce.current); debounce.current = setTimeout(() => { callback.apply(context, args); }, delay); }, [callback, delay], ); } /* Usage: const handleWindowResize = useDebounce(SetWindow) useEffect(() => { window.addEventListener('resize', handleResize) */
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter