📄 tanstack/pacer/latest/docs/reference/functions/debounce
File: debounce.md | Updated: 11/15/2025
Source: https://tanstack.com/pacer/latest/docs/reference/functions/debounce
Search...
+ K
Auto
Docs Examples GitHub Contributors
Docs Examples GitHub Contributors
Docs Examples GitHub Contributors
Docs Examples Github Contributors
Docs Examples Github Contributors
Docs Examples Github Contributors
Docs Examples Github Contributors
Docs Examples Github Contributors
Maintainers Partners Support Learn StatsBETA Discord Merch Blog GitHub Ethos Brand Guide
Documentation
Framework
React
Version
Latest
Search...
+ K
Menu
Getting Started
Guides
API Reference
Debouncer API Reference
Throttler API Reference
Rate Limiter API Reference
Queue API Reference
Batcher API Reference
Debouncer Examples
Throttler Examples
Rate Limiter Examples
Queue Examples
Batcher Examples
TanStack Query Examples
Framework
React
Version
Latest
Menu
Getting Started
Guides
API Reference
Debouncer API Reference
Throttler API Reference
Rate Limiter API Reference
Queue API Reference
Batcher API Reference
Debouncer Examples
Throttler Examples
Rate Limiter Examples
Queue Examples
Batcher Examples
TanStack Query Examples
On this page
debounce
Copy Markdown
Function: debounce()
====================
ts
function debounce<TFn>(fn, initialOptions): (...args) => void;
function debounce<TFn>(fn, initialOptions): (...args) => void;
Defined in: debouncer.ts:324
Creates a debounced function that delays invoking the provided function until after a specified wait time. Multiple calls during the wait period will cancel previous pending invocations and reset the timer.
This synchronous version is lighter weight and often all you need - upgrade to asyncDebounce when you need promises, retry support, abort/cancel capabilities, or advanced error handling.
If leading option is true, the function will execute immediately on the first call, then wait the delay before allowing another execution.
State Management:
- Uses TanStack Store for reactive state management
- Use initialState to provide initial state values when creating the debouncer
- Use onExecute callback to react to function execution and implement custom logic
- The state includes canLeadingExecute, execution count, and isPending status
- State can be accessed via the underlying Debouncer instance's store.state property
- When using framework adapters (React/Solid), state is accessed from the hook's state property
Type Parameters
---------------
### TFn
TFn extends AnyFunction
TFn
DebouncerOptions <TFn>
ts
(...args): void;
(...args): void;
...Parameters<TFn>
void
ts
const debounced = debounce(() => {
saveChanges();
}, { wait: 1000 });
// Called repeatedly but executes at most once per second
inputElement.addEventListener('input', debounced);
const debounced = debounce(() => {
saveChanges();
}, { wait: 1000 });
// Called repeatedly but executes at most once per second
inputElement.addEventListener('input', debounced);
