audioworklet 是 web audio api 中用于高性能、低延迟音频处理的现代方案，替代已废弃的 scriptprocessornode，运行在独立线程中，支持实时压缩、动态滤波等计算密集型任务。
AudioWorklet 是 Web Audio API 中用于执行高性能、低延迟音频处理的现代方案，替代了已废弃的 ScriptProcessorNode。它运行在独立线程中，不阻塞主线程或音频渲染线程，适合做实时压缩、动态滤波、自定义合成器等计算密集型任务。
AudioWorklet 的基本结构与注册流程
AudioWorklet 由两部分组成：主页面的 AudioWorkletNode（控制接口）和运行在独立线程中的 processor 脚本（实际运算逻辑）。两者通过消息通信交互，但音频数据流是直接、零拷贝传递的。
- 先用
audioContext.audioWorklet.addModule('processor.js')加载并注册 processor 脚本（需 HTTPS 或 localhost） - 脚本内需导出一个继承自
AudioWorkletProcessor的类，并重写process(inputs, outputs, parameters) - 主页面创建节点：
const node = new AudioWorkletNode(context, 'my-processor-name');
编写 processor 脚本的关键细节
processor 脚本必须是模块格式（ESM），且不能访问 DOM、window 或任何主线程 API。所有参数需通过 parameterDescriptors 声明，并在主页面用 node.port.postMessage() 或 node.parameters.set() 控制。
-
inputs和outputs是二维数组：每项为声道数组（如inputs[0][0]是左声道第一帧） - 每一帧处理必须严格同步：输入通道数、输出通道数、采样点数需保持一致
- 避免在
process()中分配新数组或调用复杂函数；推荐预分配缓冲区、使用 TypedArray 原地操作 - 若需状态持久化（如 IIR 滤波器记忆），可在 processor 类中声明属性并在构造函数初始化
典型应用场景与实现提示
相比 BiquadFilterNode 等内置节点，AudioWorklet 更适合无法用标准节点建模的算法，比如多段动态范围压缩、基于 FFT 的频谱整形、粒子合成器或 WASM 加速的音高修正。
- 做实时限幅器：在
process()中逐样本检测幅度，超阈值时按比例衰减，用指数平滑控制响应速度 - 实现立体声声像偏移：对左右声道分别应用不同增益 + 微小延迟（需注意相位一致性）
- 与 WebAssembly 配合：将计算核心（如 WSOLA 变速不变调）编译为 wasm，从 processor 中
import并同步调用 - 调试技巧：用
this.port.postMessage({type: 'log', value: xxx})向主线程发送轻量日志，避免console.log
性能与兼容性注意事项
AudioWorklet 在 Chrome 66+、Firefox 65+、Safari 15.4+ 中可用，但 iOS Safari 对多线程调度更保守，建议限制单个 processor 的 CPU 占用率（例如每帧处理不超过 2048 样本）。
- 避免频繁 postMessage 大量数据；参数更新优先走
node.parameters，它支持自动化（automation）和插值 - 多个 AudioWorkletNode 可共用同一 processor 类型，节省内存与启动开销
- 首次加载 module 有网络和编译延迟，可提前在用户交互前预加载（如点击播放按钮前调用
addModule） - 测试时启用 Chrome 的
chrome://tracing查看音频线程负载，确认无 underrun（音频断续）
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
