📄 tanstack/pacer/latest/docs/framework/react/reference/functions/useBatchedCallback

File: useBatchedCallback.md | Updated: 11/15/2025

Source: https://tanstack.com/pacer/latest/docs/framework/react/reference/functions/useBatchedCallback

TanStack

Pacer v0v0

Search...

+ K

Auto

TanStack StartRC

Docs Examples GitHub Contributors

TanStack Router

Docs Examples GitHub Contributors

TanStack Query

Docs Examples GitHub Contributors

TanStack Table

Docs Examples Github Contributors

TanStack Formnew

Docs Examples Github Contributors

TanStack DBbeta

Docs Github Contributors

TanStack Virtual

Docs Examples Github Contributors

TanStack Paceralpha

Docs Examples Github Contributors

TanStack Storealpha

Docs Examples Github Contributors

TanStack Devtoolsalpha

Docs Github Contributors

More Libraries

Maintainers Partners Support Learn StatsBETA Discord Merch Blog GitHub Ethos Brand Guide

Documentation

Framework

React logo

React

Version

Latest

Search...

+ K

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 logo

React

Version

Latest

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

useBatchedCallback

Copy Markdown

Function: useBatchedCallback()
==============================

function useBatchedCallback<TFn>(fn, options): (...args) => void;


function useBatchedCallback<TFn>(fn, options): (...args) => void;

Defined in: react-pacer/src/batcher/useBatchedCallback.ts:41

A React hook that creates a batched version of a callback function. This hook is essentially a wrapper around the basic batch function that is exported from @tanstack/pacer, but optimized for React with reactive options and a stable function reference.

The batched function will collect individual calls into batches and execute them when batch conditions are met (max size reached, wait time elapsed, or custom logic).

This hook provides a simpler API compared to useBatcher, making it ideal for basic batching needs. However, it does not expose the underlying Batcher instance.

For advanced usage requiring features like:

Manual batch execution
Access to batch state and metrics
Custom useCallback dependencies

Consider using the useBatcher hook instead.

Type Parameters
--------------- ### TFn

TFn extends AnyFunction

Parameters
---------- ### fn

(items) => void

### options

BatcherOptions<Parameters<TFn>[0]>

Returns
-------

(...args): void;


(...args): void;

### Parameters #### args

...Parameters<TFn>

### Returns

void

Example
-------

tsx

// Batch analytics events
const trackEvents = useBatchedCallback((events: AnalyticsEvent[]) => {
  sendAnalytics(events);
}, {
  maxSize: 5,    // Process when 5 events collected
  wait: 2000     // Or after 2 seconds
});

// Use in event handlers
<button onClick={() => trackEvents({ type: 'click', target: 'button' })}>
  Click me
</button>


// Batch analytics events
const trackEvents = useBatchedCallback((events: AnalyticsEvent[]) => {
  sendAnalytics(events);
}, {
  maxSize: 5,    // Process when 5 events collected
  wait: 2000     // Or after 2 seconds
});

// Use in event handlers
<button onClick={() => trackEvents({ type: 'click', target: 'button' })}>
  Click me
</button>

Edit on GitHub

useAsyncBatcher

useAsyncBatchedCallback

Partners Become a Partner

scarf analytics