Three.js From Zero · Article s9-04

S9-04 Convolution Reverb

Season 9 · Article 04

Convolution Reverb

ConvolverNode + impulse response = put your sound inside any space. Record a cathedral's echo, convolve any input with it, hear your input "in" the cathedral.

1. Impulse response (IR)

Fire a gun / pop a balloon in a room. Record the tail: that's the room's IR. It encodes everything about reflections, materials, size.

2. Convolution

Math: multiply-and-sum every input sample with every IR sample. Real: "smear" the input across the IR's decay pattern. Input now sounds like it happened in that space.

3. Web Audio

const conv = ctx.createConvolver();
const irBuffer = await fetch('cathedral-ir.wav').then(r => r.arrayBuffer());
conv.buffer = await ctx.decodeAudioData(irBuffer);

source.connect(conv).connect(ctx.destination);

4. Wet/dry mix

// Parallel path: dry (direct) + wet (reverb)
source.connect(dry).connect(master);
source.connect(conv).connect(wet).connect(master);

dry.gain.value = 0.7;  // 70% dry
wet.gain.value = 0.3;  // 30% reverb

5. Dynamic reverb zones in 3D

Walking from cave into cathedral? Smoothly crossfade wet/dry between two convolvers with different IRs.

// In your render loop, based on player zone:
const roomReverb = pickZoneByPosition(player);
// Interpolate wet amount
currentWet.gain.setTargetAtTime(roomReverb.wetAmount, ctx.currentTime, 0.3);

6. Demo — synthesized IR

Click "Kick" for dry kick drum. Click "+Cathedral" for same kick through cathedral IR. Hear the size.

IR is synthesized here (exponential-decay noise). Production: use recorded IRs from sites like OpenAIR.

7. IR sources

  • Free: OpenAIR, Freesound.org, Waves library.
  • Record your own: balloon pop + mic in a room.
  • Synthesize: decaying filtered noise (cheap, flexible).

8. Gotchas

  • IR length matters. 4-second cathedral = expensive. Keep under 2s for real-time.
  • Normalize IR to prevent volume spikes.
  • Mix in wet, not replace — always keep some dry signal.
  • Stereo IRs give width. Mono IRs collapse to center.

9. Alternative: algorithmic reverb

Schroeder/Moorer reverb = comb + allpass filters. Less realistic, much cheaper. AudioWorklet or handcrafted nodes.

For games: algorithmic is often preferable. Tunable room size via parameters, not IR swaps.

10. Takeaways

  • Convolution reverb: convolve input with an impulse response.
  • IRs come from real rooms or synthesis.
  • Wet/dry mix lets you dial in the effect.
  • Smoothly interpolate wet amount between zones in 3D.
  • Schroeder algorithmic reverb for cheaper alternative.