English
Search…
⌃K
Links

use-debounce-state

creates a bottleneck to the definition of a state, limits concurrency.

Module

import { useDebounceState } from "@atomico/hooks/use-debounce-state";

Syntax

this hook is similar to useState, but the purpose of this hook is to bottleneck the state at update time
const [state, setState] = useDebounceState(
delay:number,
initialState: any,
mode?: "fps" | "timeout" | "idle"
);
mode differences
  1. 1.
    fps:
    1. 1.
      if delay is set to 1, the update is executed for each cycle of requestAnimationFrame(60fps),
    2. 2.
      if delay is defined as 2, the update is executed for every 2 cycle of requestAnimationFrame(30fps)
  2. 2.
    timeout: the delay will be the milliseconds for setTimeout
  3. 3.
    idle : the delay will be the milliseconds for requestIdleCallback
​

Example

Last modified 9mo ago