createThrottler
Function: createThrottler()
function createThrottler<TFn, TSelected>(
fn,
initialOptions,
selector?): SolidThrottler<TFn, TSelected>
function createThrottler<TFn, TSelected>(
fn,
initialOptions,
selector?): SolidThrottler<TFn, TSelected>
Defined in: throttler/createThrottler.ts:57
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
• TSelected = ThrottlerState<TFn>
Parameters
fn
TFn
initialOptions
ThrottlerOptions<TFn>
selector?
(state) => TSelected
Returns
SolidThrottler<TFn, TSelected>
Example
// 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.
Subscribe to Bytes
Your weekly dose of JavaScript news. Delivered every Monday to over 100,000 devs, for free.