Taking a naive timer from 'it ticks' to production-grade — timer drift, effect scopes, shallowRef, Temporal API, and SSR safety.
Perry Mason in: The Case of the Drifting Timer
Opening Statement
You need a reactive "current time" in your Vue 3 app. A schedule grid with a red
line showing "now." A live clock. A dashboard that updates every minute.
Every Vue developer reaches for setInterval first. It works. But "works" and
Timer drift, effect scopes, shallowRef, and hydration explained in plain English with analogies and inline sources.
Timers look trivial until you actually build one that people rely on. "Just setInterval and decrement...
Every (or at least a lot of) project seems to have code like this somewhere: if...
advanceTimersByTime moves the clock but not the microtask queue. That mismatch is why your timer test hangs on a promise that…
ActivityKit, the Dynamic Island, and keeping a countdown alive on the lock screen — the practical gotchas from shipping it in a…
The way JavaScript handles time has evolved significantly, from the built-in `Date` API to Moment.js and now Temporal. The new…
