Web Audio API: a friendly intro for visualizers

FFT size and smoothing

The AnalyserNode exposes fftSize and smoothingTimeConstant. A larger FFT gives finer frequency resolution but reacts more slowly. Higher smoothing reduces flicker but can dull transients — the “punch” of drums.

What visualizers read

Most reactive visuals combine frequency data (which bands are loud) with time-domain samples (wave shape). Beat Visualizer also tracks derived features like spectral flux and bass energy to drive mode changes and overlays.

Try it

Open the full visualizer from the main navigation and switch sync modes while you play music — you will feel how detection and visuals interact.

For a broader mental model, see Web Audio API: build your mental model.