@crup/react-timer-hook
@crup/react-timer-hook is a lightweight React hooks library for building timers, stopwatches, and real-time clocks with minimal boilerplate.
Start with the ~1.2 kB core hook, then compose opt-in batteries for schedules, diagnostics, duration helpers, and pages with many independent timers.
npm install @crup/react-timer-hook@latest
pnpm add @crup/react-timer-hook@latest
Live preview
StopwatchLive
Stopwatch
0.0s
Elapsed0ms
Tick0
Generationnot started
Absolute countdownLive
Absolute deadline
00:30
Deadline6:52:34 PM
Remaining30s
Wall-clock sourcetimer.now
Independent timer groupLive
Timer group
0/0 uploads running
Public API
useTimer()for one lifecycleuseScheduledTimer()from/schedulesfor polling and schedule timing contextuseTimerGroup()from/groupfor many keyed independent lifecyclesdurationParts()from/durationfor duration display math
Use the root hook first. Add subpaths only when a screen needs schedules, many independent timers, display parts, or diagnostics.
Use-case shortcuts
- Core use cases: stopwatch, wall clock, absolute deadline, pausable duration countdown.
- Schedule use cases: polling, heartbeat checks, timing context, early cancel.
- Timer group use cases: auctions, checkout holds, upload rows, job dashboards.
- Composition guide: combine core, duration, schedules, groups, and diagnostics.