JavaScript Countdown Timers: Why setInterval Drifts and How to Fix It
Building a countdown timer feels like a two-minute task: let seconds = 60; const timer = setInterval(() => { seconds--; display(seconds); if (seconds <= 0) clearInterval(timer); }, 1000); Shi...

Source: DEV Community
Building a countdown timer feels like a two-minute task: let seconds = 60; const timer = setInterval(() => { seconds--; display(seconds); if (seconds <= 0) clearInterval(timer); }, 1000); Ship it. Done. Except... after a few minutes, your "60 second" timer has taken 63 seconds of wall-clock time. Users notice. This is timer drift, and every interval-based timer has it. Why setInterval Drifts setInterval(fn, 1000) doesn't fire exactly every 1000ms. It fires "at least 1000ms after the last call, when the event loop is free." Three sources of error compound over time: Scheduling jitter — The browser/Node event loop fires the callback a few milliseconds late due to other tasks Callback execution time — If your callback takes 5ms, the next interval starts 1005ms after the previous one began Tab throttling — Browsers throttle timers in background tabs to 1 second minimum (sometimes more) Small errors, big compounding: Expected: 0ms 1000ms 2000ms 3000ms 4000ms ... Actual: 0ms 1004ms 200