ImportantThrottling is ideal for high-frequency events like scroll, resize, or mousemove. It guarantees the callback runs at a consistent rate (once every delay ms).
CautionUnlike debounce, throttle will execute the first call immediately but will discard subsequent calls until the delay has passed.
The useThrottledCallback transforms a high-frequency function into a throttled version that executes at most once every delay milliseconds. It is specifically designed for handling intensive events like scroll, resize, or mousemove where executing logic on every browser trigger would degrade UI performance.
The hook utilizes a Leading-Edge execution strategy: the first invocation triggers the callback inmediately, while subsequent calls within the delay window are ignored.
| Name | Type | Description |
|---|---|---|
| callback | (...args: TArgs) => void | The function to be throttled. |
| options.delay | number | Minimum time in milliseconds between executions. |
| Name | Type | Description |
|---|---|---|
| throttledCallback | (...args: TArgs) => void | The rate-limited version of the provided callback. |
Move mouse here
Check the counters below0
Updating ~60-120fps0
Max 10 updates per second