My Pomodoro timer was not really a timer

I broke my Pomodoro timer in a boring way.

I thought the timer was simple:

start at 25 minutes, run setInterval, subtract 1 second each time.

It worked until I left the tab in the background.

Then I realized the browser was throttling the page, so the timer was not really a timer. It was just a UI pretending to be one.

The fix was to stop trusting the interval.

Instead of storing “seconds left”, I store a real deadline:

const deadlineAt = Date.now() + duration * 1000;

Then the UI just calculates the remaining time from the current clock.

That fixed the browser tab issue.

But it also made me realize something else.

The real problem wasn't accuracy.

It was visibility.

A Pomodoro timer is easy to ignore when it's hidden behind ten browser tabs.

So now I'm experimenting with a small Electron always-on-top clock for StudyTree.

Funny how a tiny timing bug ended up changing the product direction.

Have you ever built something that started as a web feature, but later felt more like a desktop feature?

Comments

[𝐓𝐡𝐞 𝐋𝐚𝐳𝐲 𝐆𝐢𝐫𝐥]

This was a fun read! 😄 I love how a simple Pomodoro timer project turned into a deeper lesson about assumptions and implementation details. The title alone made me curious, and the journey from “it works” to “wait... does it really?” is something every developer can relate to. 🚀

What was the most surprising bug or realization you encountered while building it?

[CatNight A]

Thanks! 😄

Probably realizing that accuracy wasn't the real problem.😁

Even after fixing the timer, I could still ignore it when it was hidden behind several tabs. That's what got me thinking about an always-on-top Electron version.