d3-timer

library3.0.1jsnpmunverified

An efficient queue for managing thousands of concurrent animations with consistent, synchronized timing. Version 3.0.1 (stable) uses requestAnimationFrame for fluid animation when available, falling back to setTimeout for delays >24ms. Unlike raw setInterval or setTimeout, d3-timer provides frame-level synchronization, automatic pause during page backgrounding, and guaranteed callback order within frames. Part of the D3 ecosystem, it is also usable standalone via npm or CDN (ESM, UMD, or Skypack).

testing

npm install d3-timer

github ↗package ↗homepage ↗

INSTALL

IMPORT

SIG · D3-TIMER

d3-timer

testingjavascriptv3.0.1

harness data pending

Install & Compatibility

Where this runs

No compatibility data collected yet for this library.

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

timer

✓ import { timer } from 'd3-timer'

✗ const timer = require('d3-timer')

ESM-only since v3; CommonJS require will not work in Node >=12. Use the named import for the callback-based timer.

now

✓ import { now } from 'd3-timer'

✗ const { now } = d3.timer

now() returns the current time (performance.now or Date.now) and is not a constructor. Always import via ESM.

Timer (type)

✓ import type { Timer } from 'd3-timer'

✗ import { Timer } from 'd3-timer'

Timer is an interface/class type for TypeScript; the runtime constructors are timer(), timeout(), interval(). Do not attempt to use Timer as a value.

Creates a timer that logs elapsed time every frame, stops after 500ms, and shows current time via now().

import { timer, now } from 'd3-timer'; const t = timer((elapsed) => { console.log(`Elapsed: ${elapsed}ms`); if (elapsed > 500) t.stop(); }, 100); // Check current frame time console.log('Current time:', now());

Debug

Known issues

breakingd3-timer v3 is ESM-only; Node >=12 required and CommonJS require() will fail.

fix

Use dynamic import() or switch to ESM. For Node <12 or CJS, stay on v2.

affects: >=3.0.0

gotchatimer.callback returns undefined when called inside the callback; always use the returned timer object's stop() method.

fix

Store the timer reference: const t = d3.timer(cb); t.stop();

affects: >=1.0.0

gotchaApparent elapsed time may freeze when page is backgrounded (requestAnimationFrame pauses). Use performance.now() for real wall-clock time if needed.

fix

Do not rely on elapsed for wall-clock accuracy during background tabs.

affects: >=1.0.0

deprecatedd3.timer.flush() is deprecated in v3; use timer.stop() and schedule a new timer instead.

fix

Remove flush() calls. For immediate execution, invoke callback directly or use setTimeout(fn, 0).

affects: >=3.0.0

Errors

Common errors & fixes

Cannot find module 'd3-timer'

Package not installed or import path incorrect in CJS environment.

fix

npm install d3-timer and use ESM import. For CJS, pin to v2: npm install d3-timer@2

d3.timer is not a function

Using CommonJS require on v3 ESM package.

fix

Use ES module syntax or downgrade to d3-timer@2.

TypeError: t.stop is not a function

Calling stop() on a timer that has already been stopped or using an invalid reference.

fix

Always assign timer() return value: const t = d3.timer(cb); then t.stop().

Upgrade

Version history

3.0.1latest on npm

Audit

Dependencies

No dependency data recorded yet.

Agent activity

9 hits · last 30 days

node

Resources

githubhttps://github.com/d3/d3-timer ↗

packaged3-timer ↗

homepagehttps://d3js.org/d3-timer/ ↗