raf

raf is a small polyfill for requestAnimationFrame and cancelAnimationFrame that works in both Node.js and browser environments. It first tries the native (or vendor-prefixed) implementation and falls back to a setTimeout-based queue timed to roughly 60fps when neither is available, using the performance-now package for consistent timing.

The library exposes the same raf(callback) / raf.cancel(handle) calling convention as the native browser API, plus a raf.polyfill([object]) helper that patches requestAnimationFrame/cancelAnimationFrame directly onto window or a given object. It is widely depended upon transitively by animation and UI libraries that need a dependable frame-scheduling primitive without caring whether the runtime is a browser or Node.js.

What You Get

• A raf(callback) function matching the native requestAnimationFrame signature
• raf.cancel(handle) to cancel a queued callback
• raf.polyfill([object]) to patch requestAnimationFrame/cancelAnimationFrame onto window or a custom object
• Automatic vendor-prefix detection (moz, webkit) before falling back to a manual queue

Common Use Cases

• Providing a consistent animation-frame primitive for libraries that must run in both Node.js (SSR/testing) and browser contexts
• Polyfilling requestAnimationFrame in older or non-standard browser environments
• Driving custom animation loops in UI libraries without depending on a full animation framework
• Server-side rendering or headless-testing setups where window.requestAnimationFrame doesn’t exist

Under The Hood

Architecture - The whole package is a single index.js module: it detects a native (or vendor-prefixed) requestAnimationFrame/cancelAnimationFrame on window/global, and if neither is found, builds a small closure-based fallback consisting of a queue array, a last timestamp, and an incrementing id handle counter. The fallback schedules a single setTimeout per batch (timed against performance-now) that drains the whole queue, invoking each non-cancelled callback and re-arming for the next 60fps tick. polyfill.js and window.js are thin entry variants that call .polyfill() immediately or target a specific object. Tech Stack - Plain, dependency-light JavaScript (ES5-style, no build step) with a single runtime dependency on performance-now for consistent high-resolution timing across environments; no TypeScript, no bundler config, and the published package is the raw source. Code Quality - test.js exercises the queueing/cancellation behavior with a simple assertion-style test file; the code favors small, readable functions with minimal branching, though there is no formal type layer and error handling around user callbacks is limited to wrapping invocation in try/catch and rethrowing async via setTimeout. API Design - The API mirrors the native requestAnimationFrame/cancelAnimationFrame contract exactly (raf(callback) returns a handle, raf.cancel(handle) cancels it), which makes it a true drop-in replacement requiring zero learning curve for anyone already familiar with the browser API, plus one additional raf.polyfill() convenience method for global patching.