Skip to main content

throttle

Added in v1.1.0

The throttle operator limits how frequently values are emitted by introducing a delay window.
It can emit either the first or last value in each window, depending on the mode.


✅ Basic usage

import { event } from "signux";
import { throttle } from "signux/operators";

const clicks = event<number>();
const throttled = clicks.pipe(throttle(300));

throttled.subscribe((n) => console.log("Click:", n));

⚙️ How it works

It enforces a time window (delay in milliseconds) where only one value is allowed through.
In "lead" mode (default), the first value is emitted and the rest are ignored.
In "trail" mode, the last value is saved and emitted at the end of the delay.


🧩 Use cases

  • Limit frequency of events like scroll, mousemove, or keypress
  • Prevent expensive computations from firing too often
  • Add spacing between reactive updates

📦 Signature

function throttle<T>(delay: number, mode?: "lead" | "trail"): OperatorFn<T>;

🔀 Modes

ModeDescription
"lead" (default)Emits the first value immediately and ignores the rest until the delay ends
"trail"Waits until the delay ends and emits the last value received during that time

🧪 Example with state

const counter = state(0);
const delayed = counter.pipe(throttle(500, "trail"));
info

Use "lead" mode when you want to react right away, and "trail" mode to wait and emit the final result.