Skip to content
On this page
AsyncClient Component

useDebounce

Overview

useDebounce delays value publication until input changes settle, with optional leading, trailing, and maximum-wait behavior.

Signature

ts
function useDebounce<T>(
  value: T,
  options: {
    delay: number;
    leading?: boolean;
    trailing?: boolean;
    maxWait?: number;
  },
): T;

Parameters

delay is clamped to zero or greater. leading defaults to false, trailing to true. A finite maxWait forces publication during a continuous cycle.

Returns

The last published value, initialized from the first value.

Behavior

A cycle starts only when Object.is detects a value change. Timers are replaced as changes arrive and cleared on unmount.

SSR / RSC

The input value is returned during SSR; timers begin in effects after commit. Use in a Client Component.

Example

Composition

Use useAsync to run cancellable work when settledQuery changes. For event calls, prefer useDebounceFn.

Source

Read the implementation on GitHub.