Estoy usando requestAnimationFrame para actualizar cada 1 segundo un temporizador.

 const [secondsPassed, setSecondsPassed] = useState(0) const t0Ref = useRef(Date.now()) const requestRef = useRef() const targetValueRef = useRef(0) const updateSecondsPassed = useCallback(() => { const time = Date.now() - t0Ref.current const nextValue = time * 0.001 if (nextValue >= sessionTime) { console.log('Reset to 0') setSecondsPassed(0) return } const targetValue = targetValueRef.current if (nextValue >= targetValue) { console.log(`Update ${targetValue - 1} -> ${nextValue | 0}`) setSecondsPassed(targetValue) targetValueRef.current = targetValue + 1 } requestRef.current = requestAnimationFrame(updateSecondsPassed) }, [sessionTime]) useEffect(() => { if (playbackState === 'initial' || playbackState === 'stopped') { setSecondsPassed(0) targetValueRef.current = 0 } if (playbackState === 'playing') { t0Ref.current = Date.now() requestRef.current = requestAnimationFrame(updateSecondsPassed) } if (playbackState === 'paused') { console.log(secondsPassed) } if (playbackState === 'resumed') { // Code here... } return () => cancelAnimationFrame(requestRef.current) }, [playbackState])

El problema es que probé todo en el bloque de estado de reproducción 'reanudado' y espera la cantidad de segundos que ya pasaron antes de comenzar a contar nuevamente.