<pre class="shiki github-dark shaku"><code>import {useState, useEffect, useRef} from 'react';export function useDebounce&lt;T&gt;(value: T, delay: number): T { const [debounced, setDebounced] = useState&lt;T&gt;(value); const idRef = useRef&lt;number | undefined&gt;(); useEffect(() =&gt; { clearTimeout(idRef.current) idRef.current = setTimeout(() =&gt; setDebounced(value), delay) return () =&gt; clearTimeout(idRef.current); }, [value]) return debounced;}</code></pre>

Basic Debounce with Types

For a frequently changing value like text input you might want to debounce the changes. Implement useDebounce() to achieve this. function App() { cons…