Skip to content

Latest commit

 

History

History
39 lines (25 loc) · 1.14 KB

README.md

File metadata and controls

39 lines (25 loc) · 1.14 KB

on-frame

npm (scoped) npm bundle size (scoped) NPM

Batches calls to requestAnimationFrame.

API

  • onFrame(subscriber: Subscriber): () => boolean
  • type Subscriber = (time: DOMHighResTimeStamp) => void;

How it works

The return value of onFrame is an unsubscribe function, it returns a booleanthat indicates if unsubscribing was successful.

The timestamp passed to the subscriber is the original timestamp as provided by the requestAnimationFrame callback.

Functions can only be subscribed once, but invoking it multiple times is fine as it will also return an unsubscribe function.

Example

import { onFrame } from 'on-frame';

let i = 0;

const unsubscribe = onFrame((time) => {
  console.log(`frame called at ${time}`);

  i += 1;

  // stop after 5 ticks
  if (i === 5) {
    unsubscribe();
  }
});