Minuteur Pomodoro

Le minuteur Pomodoro accompagne la technique Pomodoro, une méthode de gestion du temps fondée sur des intervalles nets de concentration et de pause. Le modèle classique prévoit 25 minutes de travail focalisé, une courte pause d’environ 5 minutes, puis un repos plus long après plusieurs cycles. Sa valeur ne tient pas au chiffre exact, mais à la limite créée: les tâches paraissent plus petites, les distractions peuvent être reportées et les pauses évitent une baisse d’attention invisible. L’outil sert aux études, à l’écriture, au développement, aux tâches domestiques, à l’administratif et aux routines. Pour réunions, création profonde ou travail physique, les durées doivent rester flexibles.

La technique Pomodoro a été publiée par Francesco Cirillo à la fin des années 1980 et formalise un cycle en quatre phases : un intervalle de concentration de 25 minutes (un pomodoro), une pause courte de 5 minutes, répété sur quatre tours, puis une pause longue de 15 à 30 minutes. Le planning est une machine à états finis sur quatre états (`work`, `shortBreak`, `longBreak`, `idle`) avec des transitions pilotées par un seul minuteur ; le compteur de tours s'incrémente après chaque transition `work -> break` et la branche de pause longue se déclenche lorsque `round % roundsBeforeLong === 0`. Les variantes comme 50/10 (travail profond) et 52/17 (étude de productivité Draugiem Group) sont exposées en paramétrant la même machine à états. Un chronométrage naïf utilise `setInterval(tick, 1000)` et décrémente un compteur, mais la dérive des minuteurs JavaScript s'accumule : chaque rappel peut se déclencher avec 1003 à 1020 ms de retard sous contention du thread principal, et l'API HTML5 Page Visibility combinée aux politiques des navigateurs limite les minuteurs des onglets masqués à environ 1 Hz dans Chrome/Firefox/Safari (Safari peut descendre à 1 déclenchement/min). Le modèle résistant à la dérive stocke `endTimestamp = performance.now() + remainingMs` au démarrage, puis recalcule `remainingMs = Math.max(0, endTimestamp - performance.now())` à chaque tick — un onglet qui reprend après 10 minutes en arrière-plan rattrape immédiatement le temps perdu au lieu de compter 10 secondes fictives. `performance.now()` est l'horloge monotone haute résolution immunisée contre les ajustements d'horloge murale (NTP, changements manuels de l'heure) ; `Date.now()` n'est utilisé que pour persister l'échéance lors du rafraîchissement de la page. Quatre API navigateur rendent le minuteur utilisable pendant que l'utilisateur travaille ailleurs. L'API Web Audio génère le bip de fin de phase sans coût de ressource : `new AudioContext()` -> `createOscillator()` à 800 Hz -> `createGain()` avec descente linéaire sur 200 ms -> `start()` puis `stop(currentTime + 0.2)`. L'API Notifications affiche une alerte au niveau système après consentement unique via `Notification.requestPermission()`, puis `new Notification('Focus complete', { body, icon, tag: 'pomodoro' })` (le `tag` déduplique les déclenchements rapides). L'API Wake Lock demande `navigator.wakeLock.request('screen')` pour maintenir l'écran allumé pendant une session de concentration et le libère pendant les pauses. Le `document.title` est réécrit à chaque tick en `mm:ss - Concentration` pour que le temps reste visible dans la barre d'onglets. Les paramètres (durées, démarrage automatique, son) persistent via `localStorage` (synchrone, ~5 Mo de quota par origine) ; la progression circulaire est un SVG `<circle>` dont le `stroke-dasharray = 2 * pi * r` et le `stroke-dashoffset = dasharray * (1 - elapsed/total)` animent l'anneau sans surcoût canvas.

• Machine à états sur quatre états (work/shortBreak/longBreak/idle) ; la pause longue se déclenche lorsque `round % roundsBeforeLong === 0`. Par défaut 25/5/15 minutes, 4 tours ; variantes 50/10/30 (travail profond) et 52/17 (étude Draugiem).
• Chronométrage résistant à la dérive : stocker `endTimestamp = performance.now() + remainingMs` et recalculer `remainingMs = endTimestamp - performance.now()` à chaque tick — immunisé contre le glissement de `setInterval` et contre la limitation des onglets masqués.
• `performance.now()` est l'horloge monotone haute résolution (non affectée par les changements NTP ou manuels de l'horloge murale) ; `Date.now()` n'est utilisé que pour persister l'échéance lors du rechargement de la page.
• Bip de fin de phase via l'API Web Audio : `new AudioContext()` -> `createOscillator()` (sinusoïde 800 Hz) -> `createGain()` avec rampe linéaire à 0 sur 200 ms -> `start()`/`stop()`. Aucun fichier audio embarqué.
• Alertes système via l'API Notifications : `Notification.requestPermission()` une seule fois, puis `new Notification(title, { body, tag: 'pomodoro' })` ; le `tag` déduplique si plusieurs phases se terminent pendant que l'onglet est masqué.
• API Wake Lock écran : `navigator.wakeLock.request('screen')` pendant la concentration pour empêcher la mise en veille de l'écran ; libération pendant la pause. Les verrous sont automatiquement libérés lorsque l'onglet perd la visibilité et doivent être réacquérir sur `visibilitychange`.
• Persistance et interface : `localStorage` (~5 Mo de quota) pour les durées/le démarrage automatique/le son ; l'anneau SVG utilise `stroke-dasharray = 2*pi*r` et anime le `stroke-dashoffset` ; `document.title` réécrit en `mm:ss - Phase` pour la visibilité dans la barre d'onglets.