Rust 编写的 8 复音减法合成器,WebAssembly 在 AudioWorklet 音频线程里实时生成声音
点击「启动音频」后弹奏琴键
👆 按琴键 发声(可多指、可滑动) | 电脑键盘 A~; 对应白键,W E T Y U O P 对应黑键
减法合成是模拟合成器最经典的做法:先用振荡器产生谐波丰富的波形,再用滤波器「减掉」一部分高频,最后用包络控制音量随时间的变化。这个合成器完全用 Rust 编写,编译成不依赖任何胶水代码的 .wasm,直接运行在浏览器的 AudioWorklet 音频线程里:每 128 个采样(48kHz 下约 2.7ms)调用一次 Rust 生成下一段声音。
AudioContext,加载 processor.js,并把 pkg/synth/index.wasm 的字节通过 processorOptions 传给音频线程。AudioWorkletProcessor 用 WebAssembly.instantiate 实例化模块。这个 crate 不用 wasm-bindgen:音频线程不能加载 pkg 里的 ES 模块胶水,而裸的 extern "C" 导出只需要数字参数,imports 为空。synth_render(128),Rust 把 128 个采样写进自己内存里的缓冲区并返回指针;JS 用 Float32Array 直接读这块内存复制到输出,不经过任何序列化。port.postMessage 发给音频线程,再调用 synth_note_on / synth_note_off / synth_set_param。示波器从 AnalyserNode 读取波形,按上升过零点对齐,周期波形就能稳定显示。localhost 可以,手机通过局域网 IP 访问需要 HTTPS。iPhone 的静音开关打开时网页没有声音。源码crates/media/synth/src/lib.rswww/synth/processor.jswww/synth/index.js