useRaf

Hook that defines the logic for raf callback

browser

low

test coverage

Last changed: 7 months ago

TIP

This hook uses requestAnimationFrame browser api to provide enhanced functionality. Make sure to check for compatibility with different browsers when using this api

Installation

Library

CLI

Manual

import { useRaf } from '@siberiacancode/reactuse';

Usage

useRaf(() => console.log('callback'));

Demo

source

Api

Parameters

Name	Type	Default	Note
callback	UseRafCallback	-	The callback to execute
options.delay?	number	-	The delay between each frame in milliseconds
options.enabled?	boolean	true	Whether the callback should be enabled

Returns

UseRafCallbackReturn

Type declaration

export interface UseRafParams {
  /** The delta between each frame in milliseconds */
  delta: number;
  /** The timestamp of the current frame in milliseconds */
  timestamp: DOMHighResTimeStamp;
}

export type UseRafCallback = (params: UseRafParams) => void;

export interface UseRafOptions {
  /** The delay between each frame in milliseconds */
  delay?: number;
  /** Whether the callback should be enabled */
  enabled?: boolean;
}

export interface UseRafReturn {
  /** Whether the callback is active */
  active: boolean;
  /** Function to pause the callback */
  pause: () => void;
  /** Function to resume the callback */
  resume: () => void;
}

Source

Source • Demo

Contributors

D

debabin