Why I replaced looping MP3s with live Web Audio API math for my focus timer (Cadenzato)

说明与用途

Cadenzato 用 Web Audio API 实时合成音频，消除了循环 MP3 的广告和疲劳，并在切换标签时暂停画布渲染，降低 GPU 使用率。

问题

Developers experience interruptions from mid-roll ads and audio loop fatigue when using ambient focus apps, and visual timers can consume significant GPU resources.

结果

Cadenzato eliminates mid‑roll ads and audio loop fatigue while keeping CPU/GPU usage minimal, enabling developers to maintain deep focus during coding sessions.

工作流

• 1. User opens Cadenzato in the browser.
• 2. Presses Space to start a Pomodoro interval (e.g., 50/10).
• 3. Selects or mixes audio channels (Brownian noise, rain, hearth fire, binaural pulses).
• 4. The app synthesizes each sound live using custom Web Audio API graphs.
• 5. Canvas scenes render at 60fps only while the tab is visible; when hidden, rendering stops and GPU usage drops to 0%.
• 6. User returns to IDE; audio continues uninterrupted, no ads or accounts required.

证据

Most ambient focus apps and streams just loop a 60-second MP3 file.

来源

Cadenzato synthesizes every sound wave live in the browser using a custom Web Audio API graph

来源

The instant you Alt+Tab back to VS Code or switch windows, the canvas render loop suspends completely to 0% GPU usage while the Web Audio synthesizer continues running on its dedicated audio thread.

来源