Web Audio with audio/ui

Sound and live data for audio/ui controls. Getting sound out takes an AudioContext that is allowed to start, parameters that move without clicks, and a clock that does not drift. Showing sound takes sources that update outside React: a meter that re-renders the page 60 times a second is the most common way an audio interface becomes slow.

When to Apply

• Starting sound from a button: creating, resuming and cleaning up an AudioContext
• Connecting a knob or fader to a GainNode, filter or oscillator parameter
• Scheduling notes from a step sequencer, a piano roll or a transport clock
• Showing live level, spectrum, waveform or playhead position
• Reading the microphone, a MIDI keyboard or the pitch of a sound
• Fixing clicks, zipper noise, distortion, timing drift or a page that re-renders every frame

Rule Categories by Priority