skills.rest
janpeterd
janpeterdCOMMUNITY
Explore all skills by this author →
GitHub

tanstack-pacer

Provide debouncing, throttling, rate limiting, queuing, and batching utilities for TypeScript and React.

Updated Jul 2, 2025
Search Tags:#typescript#rate limiting#batching#react hooks#throttling#queuing#debouncing
One-click install
npx skills add https://github.com/janpeterd/dotfiles --skill tanstack-pacer-janpeterd
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: tanstack-pacer
Source: https://github.com/janpeterd/dotfiles/tree/main/dot_agents/skills/tanstack-pacer
Command: npx skills add https://github.com/janpeterd/dotfiles --skill tanstack-pacer-janpeterd

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

TanStack Pacer helps you prevent excessive or poorly-timed function calls by providing reliable debouncing, throttling, rate limiting, queuing, and batching utilities.

Core Features & Use Cases

  • Debouncing and Throttling: Use for search inputs (debounce) and scroll/resize handling (throttle) to reduce redundant work while staying responsive.
  • Rate Limiting: Apply to protect APIs and enforce request budgets per time window, including handling rejections.
  • Queuing and Batching: Use queues for sequential tasks like uploads and batching for efficiency when you can group events or items before sending them.

Quick Start

Install @tanstack/pacer and @tanstack/react-pacer, then use the appropriate class or React hook to wrap your function (for example, debounce a search handler so it fires only after the user stops typing).

Frequently Asked Questions about tanstack-pacer

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I debounce search inputs in React to reduce redundant API calls?▼

To prevent bursty behavior, debounce search inputs using the @tanstack/react-pacer hook to wrap your handler. This ensures the function only fires after the user stops typing, reducing redundant API calls.

What is the difference between throttling and rate limiting for API calls?▼

Throttling reduces redundant work during scroll or resize events by enforcing execution timing windows, while rate limiting protects APIs by enforcing a strict request budget per time window, including handling rejections.

How do I batch events or items before sending them in TypeScript?▼

To batch events or items in TypeScript, use the batching utilities from @tanstack/pacer. This allows you to group events or items together before sending them, improving efficiency for grouped operations.

Does TanStack Pacer work with plain TypeScript or only with React hooks?▼

TanStack Pacer works with both plain TypeScript and React. It requires @tanstack/pacer for core timing-control utilities and optionally @tanstack/react-pacer for React hook workflows like search inputs and scroll events.

What's the best way to queue sequential tasks like file uploads in TypeScript?▼

The best way to queue sequential tasks like uploads in TypeScript is using the queuing utilities from @tanstack/pacer. This ensures sequential task execution and prevents unsafe concurrent function calls.

Related Skills

Explore More Software Engineering Skills→
JeromyJSmithJeromyJSmith
3

tanstack-pacer

Debounce, throttle, rate limit, queue, and batch function calls.

Community
Basic
vtexvtex
39

marketplace-rate-limiting

Manage VTEX API rate limits with exponential backoff and circuit breaking.

Official
Advanced
yonetim258852yonetim258852

web3d-integration-patterns

Architect multi-library 3D web apps integrating Three.js, GSAP, React Three Fiber, Motion, and React Spring.

Community
Advanced
tanstack-skillstanstack-skills
29

tanstack-pacer

Coordinate debouncing, throttling, rate limiting, queuing, and batching with TypeScript APIs.

Official
Advanced