在声学工程里，声音从来不是脱离环境孤立存在的。在空旷的地下排练室弹贝斯，声音干瘪生硬；而在维也纳金色大厅或阿姆斯特丹皇家音乐厅，哪怕只是轻轻敲一下三角铁，声音也会被大厅内数以万计的木质浮雕与墙壁反复折射、衰减，形成长达两秒、温暖且具有丰富空气感的空间尾音（Reverb Tail）。
在 Web Audio API 中做空间混响，很多开发者第一反应是去查经典的算法混响（如基于 Schroeder-Moorer 架构的梳状与全通滤波器串联）。但算法混响需要调校极多参数，稍不留神就会产生极其廉价刺耳的金属共振杂音（Metallic Ringing）。
真正顶级的声学空间还原，必须依靠卷积混响（Convolution Reverb）。
通过采集或算法程序化生成一个特定房间的“脉冲响应（Impulse Response, IR）”，利用数学上的卷积运算，Web Audio 的ConvolverNode能让任何干声信号（Dry Signal）瞬间“穿梭”进真实的音乐厅或教堂空间中。
卷积混响的声学物理与数学本质
设想在音乐厅的正中央鸣放一把发令枪。这一瞬间发出的极短声响（无限接近数学上的狄拉克 $\delta$ 函数），声波以每秒 340 米的速度向四周扩散：
- 直达声（Direct Sound）：声波最先沿着直线进入人耳，能量最强，定义了声音的方位；
- 早期反射声（Early Reflections）：声波经过地面、天花板和侧墙的 1
3 次初级反射到达，延迟通常在 10ms80ms 之间，为人脑提供房间长宽高和体积尺度的关键空间几何线索； - 晚期混响（Late Reverb / Diffuse Field）：声波在复杂表面上经历成千上万次无序漫反射，不同相位的声波交织在一起，形成致密平滑、按指数规律衰减的统计声场。
用麦克风把这整个衰减过程记录下来，得到的就是一段音频波形 $h(t)$，即该房间的脉冲响应（IR）。
根据线性时不变系统（LTI）理论，当任意乐器或人声音频信号 $x(t)$ 输入到这个房间时，输出的最终声音 $y(t)$ 就是输入信号与房间脉冲响应的时域卷积积分：
$$y(t) = (x * h)(t) = \int_{-\infty}^{\infty} x(\tau) h(t - \tau) d\tau$$
在离散时间域（数字音频）中：
$$y[n] = \sum_{k=0}^{M-1} x[n - k] \cdot h[k]$$
现代浏览器底层的ConvolverNode在 C++ 层通过快速傅里叶变换（FFT）将这一运算转化为频域乘法，在硬件多核与 SIMD 加速下，卷积计算的开销被压缩到极低。
程序化生成脉冲响应（Procedural IR）：省掉庞大 WAV 加载
使用真实采集的 IR 音频文件（通常是几兆大小的 24-bit WAV）效果极佳，但在移动端或高并发页面中，多下载一个 5MB 的音频文件会严重拖慢首屏体验。
其实，我们完全可以用白噪声乘以指数衰减包络，配合带通滤波，在纯前端内存中程序化合成（Synthesize）高品质的音乐厅脉冲响应：
export interface HallAcousticParams { durationSeconds: number; // 混响衰减时间 RT60（秒） decayFactor: number; // 衰减陡度 diffusion: number; // 漫反射密度 (0~1) reverse?: boolean; // 是否反向混响（特效用） } export class ProceduralIRGenerator { /** * 在内存中生成合成双声道脉冲响应 AudioBuffer */ public static createConcertHallBuffer( ctx: BaseAudioContext, params: HallAcousticParams ): AudioBuffer { const { durationSeconds = 2.5, decayFactor = 3.0, diffusion = 0.8 } = params; const sampleRate = ctx.sampleRate; const length = Math.floor(sampleRate * durationSeconds); const buffer = ctx.createBuffer(2, length, sampleRate); const left = buffer.getChannelData(0); const right = buffer.getChannelData(1); for (let i = 0; i < length; i++) { const t = i / sampleRate; // 指数衰减包络：exp(-decayFactor * t) const envelope = Math.exp(-decayFactor * (t / durationSeconds)); // 双声道独立的非相干高斯/均匀白噪声 const noiseL = (Math.random() * 2 - 1); const noiseR = (Math.random() * 2 - 1); // 早期反射离散脉冲模拟（在起音前 80ms 注入微小的离散强反射） let earlyReflectL = 0; let earlyReflectR = 0; if (i === Math.floor(sampleRate * 0.018)) earlyReflectL = 0.7; // 18ms 侧墙反射 if (i === Math.floor(sampleRate * 0.027)) earlyReflectR = 0.6; // 27ms 天花板反射 if (i === Math.floor(sampleRate * 0.045)) earlyReflectL = 0.4; // 45ms 后墙反射 // 混合早期反射与致密漫反射 left[i] = (earlyReflectL + noiseL * envelope * diffusion); right[i] = (earlyReflectR + noiseR * envelope * diffusion); } return buffer; } }这段纯前端合成代码体积不足 1KB，执行耗时不足 5ms，却能在内存中瞬间凭空造出一个具有 2.5 秒自然衰减的立体声音乐厅空间。
工业级卷积混响引擎架构与干湿比混合
在真实声卡与混音台路由中，混响效果器必须具备干湿比（Dry/Wet Mix）无级平滑调节：
- 干声通道（Dry Path）：原汁原味的声音直接穿透，维持音色清晰度；
- 湿声通道（Wet Path）：声音进入
ConvolverNode进行声学卷积，随后通过均衡滤波模拟空气对高频的吸收衰减。
┌───────────────────────────┐ │ Audio Source In │ └─────────────┬─────────────┘ │ ┌─────────────┴─────────────┐ ▼ ▼ [ Dry Gain Node ] [ Pre-Delay Delay ] │ │ │ ▼ │ [ ConvolverNode ] │ │ │ ▼ │ [ Lowpass Filter ] │ │ │ ▼ │ [ Wet Gain Node ] │ │ └─────────────┬─────────────┘ ▼ ┌───────────────────────────┐ │ Master Destination │ └───────────────────────────┘下面是完整的立体声混响引擎 TypeScript 实现：
export class ConcertHallReverbEngine { private ctx: AudioContext; public inputNode: GainNode; public outputNode: GainNode; private dryGain: GainNode; private wetGain: GainNode; private preDelayNode: DelayNode; private convolverNode: ConvolverNode; private airDampingFilter: BiquadFilterNode; constructor(audioContext: AudioContext) { this.ctx = audioContext; // 1. 初始化节点链条 this.inputNode = this.ctx.createGain(); this.outputNode = this.ctx.createGain(); this.dryGain = this.ctx.createGain(); this.wetGain = this.ctx.createGain(); // 预延迟（Pre-delay）：模拟大音乐厅声波从舞台到达第一堵墙的时间（约 20ms） this.preDelayNode = this.ctx.createDelay(0.2); this.preDelayNode.delayTime.value = 0.02; this.convolverNode = this.ctx.createConvolver(); // 空气阻尼滤波（High-Frequency Damping）：在真实空气中，高频声波衰减远快于低频 this.airDampingFilter = this.ctx.createBiquadFilter(); this.airDampingFilter.type = 'lowpass'; this.airDampingFilter.frequency.value = 5500; // 5.5kHz 截止 // 2. 装配干声路由 this.inputNode.connect(this.dryGain); this.dryGain.connect(this.outputNode); // 3. 装配湿声卷积路由 this.inputNode.connect(this.preDelayNode); this.preDelayNode.connect(this.convolverNode); this.convolverNode.connect(this.airDampingFilter); this.airDampingFilter.connect(this.wetGain); this.wetGain.connect(this.outputNode); // 4. 加载默认音乐厅声学配置 this.updateAcoustics({ durationSeconds: 2.2, decayFactor: 2.8, diffusion: 0.85, }); // 默认干湿比：干声 80%，湿声 20% this.setMix(0.2); } /** * 动态刷新空间声学校准参数 */ public updateAcoustics(params: HallAcousticParams): void { const irBuffer = ProceduralIRGenerator.createConcertHallBuffer(this.ctx, params); this.convolverNode.buffer = irBuffer; } /** * 设置干湿比 0.0 (纯干) ~ 1.0 (纯湿)，采用等功率曲线（Equal-Power Crossfade） */ public setMix(wetRatio: number): void { const clamped = Math.min(Math.max(wetRatio, 0), 1); const now = this.ctx.currentTime; // 维持等功率交叉淡入淡出，防止在滑块推到中间 0.5 时总体声压下陷 const dryGainVal = Math.cos(clamped * 0.5 * Math.PI); const wetGainVal = Math.sin(clamped * 0.5 * Math.PI); this.dryGain.gain.setTargetAtTime(dryGainVal, now, 0.02); this.wetGain.gain.setTargetAtTime(wetGainVal, now, 0.02); } /** * 调节房间尺寸带来的预延迟时间 (0 ~ 100ms) */ public setPreDelay(ms: number): void { const seconds = Math.min(Math.max(ms / 1000, 0), 0.1); this.preDelayNode.delayTime.setTargetAtTime(seconds, this.ctx.currentTime, 0.02); } }现场实测与声学避坑经验
在前端工程落地卷积混响时，有两点至关重要的经验：
第一，切忌在播放过程中频繁给convolverNode.buffer重新赋值。Web Audio 规范规定，修改buffer会引发内部状态重建，可能导致扬声器发出极其响亮的数字爆音（Click/Pop）。如果要切换不同的房间预设（如小房间、中等爵士俱乐部、大教堂），应该预先创建 2~3 个并联的ConvolverNode，通过其输出端的GainNode进行平滑音量渐变交叉淡化。
第二，注意等功率交叉衰减（Equal-Power Crossfade）。如果简单用线性比例（dry = 1 - mix,wet = mix），当滑块推到 0.5 时，声功率会下降 3dB，用户会明显感觉声音突然“虚了”。代码中采用正弦/余弦交叉函数，是保证声场能量平衡的专业基准。
不需要下载数兆的离线样本，仅用数十行数学逻辑在内存中生成指数衰减与早期脉冲，再交给浏览器原生的硬件级卷积节点，网页就能瞬间变身一座具有沉浸声学呼吸感的数字音乐厅。
