Framework
Version
Debouncer API Reference
Throttler API Reference
Rate Limiter API Reference
Queue API Reference

createThrottler

Function: createThrottler()

ts
function createThrottler<TFn>(fn, initialOptions): SolidThrottler<TFn>
function createThrottler<TFn>(fn, initialOptions): SolidThrottler<TFn>

Defined in: throttler/createThrottler.ts:59

A low-level Solid hook that creates a Throttler instance that limits how often the provided function can execute.

This hook is designed to be flexible and state-management agnostic - it simply returns a throttler instance that you can integrate with any state management solution (createSignal, Redux, Zustand, Jotai, etc). For a simpler and higher-level hook that integrates directly with Solid's createSignal, see createThrottledSignal.

Throttling ensures a function executes at most once within a specified time window, regardless of how many times it is called. This is useful for rate-limiting expensive operations or UI updates.

Type Parameters

TFn extends AnyFunction

Parameters

fn

TFn

initialOptions

ThrottlerOptions<TFn>

Returns

SolidThrottler<TFn>

Example

tsx
// Basic throttling with custom state
const [value, setValue] = createSignal(0);
const throttler = createThrottler(setValue, { wait: 1000 });

// With any state manager
const throttler = createThrottler(
  (value) => stateManager.setState(value),
  {
    wait: 2000,
    leading: true,   // Execute immediately on first call
    trailing: false  // Skip trailing edge updates
  }
);

// Access throttler state via signals
console.log(throttler.executionCount()); // number of times executed
console.log(throttler.isPending());      // whether throttled function is pending
console.log(throttler.lastExecutionTime()); // timestamp of last execution
console.log(throttler.nextExecutionTime()); // timestamp of next allowed execution
// Basic throttling with custom state
const [value, setValue] = createSignal(0);
const throttler = createThrottler(setValue, { wait: 1000 });

// With any state manager
const throttler = createThrottler(
  (value) => stateManager.setState(value),
  {
    wait: 2000,
    leading: true,   // Execute immediately on first call
    trailing: false  // Skip trailing edge updates
  }
);

// Access throttler state via signals
console.log(throttler.executionCount()); // number of times executed
console.log(throttler.isPending());      // whether throttled function is pending
console.log(throttler.lastExecutionTime()); // timestamp of last execution
console.log(throttler.nextExecutionTime()); // timestamp of next allowed execution
Subscribe to Bytes

Your weekly dose of JavaScript news. Delivered every Monday to over 100,000 devs, for free.

Bytes

No spam. Unsubscribe at any time.