learning_ai_clock/web/src/lib/use-tick.ts

29 lines
764 B
TypeScript

// ── rAF Tick Loop Hook ─────────────────────────────────────────
// Drives the UI countdown display at ~60fps in active tab
'use client';
import { useEffect, useRef } from 'react';
import { useTimerStore } from './store';
export function useTickLoop() {
const tick = useTimerStore((s) => s.tick);
const rafRef = useRef<number>(0);
useEffect(() => {
let running = true;
function loop() {
if (!running) return;
tick(Date.now());
rafRef.current = requestAnimationFrame(loop);
}
rafRef.current = requestAnimationFrame(loop);
return () => {
running = false;
cancelAnimationFrame(rafRef.current);
};
}, [tick]);
}