case study
Pomero
An installable browser Pomodoro timer with task tracking and stats
overview
Pomero is a browser Pomodoro timer. It cycles through focus sessions, short breaks and long breaks, and it records each focus session against a task. It runs fully client-side, keeps its history in IndexedDB, and can be installed as a PWA.
problem
Simple online Pomodoro timers tend to drift or stop when the tab is in the background. They also don't show where your focus time actually went. I wanted a timer that keeps accurate time, tells me when a round ends, and shows focus time per task without needing an account.
approach
- 01Moved the countdown into a Web Worker so it keeps ticking while the tab is in the background.
- 02Save every completed focus session to IndexedDB, indexed by task, and put settings, tasks and preferences in localStorage.
- 03Added a web manifest and a service worker so the app can be installed and still load from cache when the network fails.
- 04Used the Notification API to announce the end of each round, and the Web Audio API for optional white noise that fades in and out with focus sessions.
features
Configurable cycles
Focus, short break and long break lengths can be changed, along with how many focus rounds come before a long break.
Task tracking
Users create tasks, choose the active one, and each finished focus session is logged against it.
Statistics
A stats panel shows recorded sessions over a chosen time period, with per-task pie and bar breakdowns.
Backup and restore
Session history can be exported as a JSON file and imported again later.
Small comforts
Spacebar to start or pause, the remaining time in the tab title, color themes, and a Picture-in-Picture timer in browsers that support it.
challenges
Keeping time in background tabs
Browsers throttle timers on the main thread in inactive tabs. So the tick loop runs in a dedicated worker that posts elapsed seconds back to the page.
Choosing where data lives
Small settings go in localStorage. Session records, which keep growing, go in an IndexedDB store with a task index so the stats panel can query them by task.
outcome
Pomero is live on GitHub Pages as a working timer. It was my first hands-on use of Web Workers, service workers, IndexedDB and the Notification API in one app.
stack
contact
Have something worth building?
Open to freelance. Fastest response on WhatsApp ↗ — usually within the hour.