DEV Community

Cover image for Building a Browser-Based Microphone Diagnostic Tool with the Web Audio API
victor hedvi
victor hedvi

Posted on

Building a Browser-Based Microphone Diagnostic Tool with the Web Audio API

Most "mic test" tools online do one thing: show you a moving bar while you talk, and call it done. That tells you the browser can hear something — it doesn't tell you whether the signal is actually usable for a call or a recording.

I wanted to build something that answers the real question: what, specifically, is wrong with this mic signal — and what do I do about it?

The four things that actually matter

Using the Web Audio API (AnalyserNode + a short buffered recording), the tool captures ~10 seconds of audio and analyzes four independent properties:

  1. Peak level — is the signal clipping? Any sample hitting (or near) full scale means the input gain is too hot, and the result will sound harsh and distorted no matter how good the mic is.
  2. Noise floor — is there a constant hum or hiss under the voice? Measured during the gaps between words, not just an average — averaging hides a steady 50/60Hz hum under a loud voice.
  3. Signal-to-noise headroom — is the mic just too quiet? Different from clipping: a weak signal close to the noise floor is the classic "input gain set too low" symptom, and in my own research it turned out to be the most common complaint by a wide margin.
  4. Reverb tail — does the room talk back? A crude decay-time estimate on the trailing edge of speech segments catches "sounds like a bathroom" before the user even notices it consciously.

None of these need a server round-trip — it all runs client-side, which also means the audio never leaves the browser.

The interesting part: false positives

The hard part wasn't detecting these four things in isolation — it was avoiding false positives when they interact. A quiet room with a loud voice can look like clipping on the peaks but be totally clean; a good mic in a noisy room can look "weak" when it's actually the noise floor that's the problem, not the signal. The diagnostic has to reason about the ratio between the four numbers, not just threshold each one independently — otherwise you get a tool that's technically accurate and practically useless.
try it
I put the live version here: fixmic.com — no signup, nothing leaves your browser. Curious if others have tackled the reverb-tail estimation differently — would love to compare notes in the comments.

Top comments (1)

Collapse
 
frank_signorini profile image
Frank

How do you handle varying sample rates with the Web Audio API in this tool? I'd love to swap ideas on improving mic diagnostics.