3 ms·

I made a synth with web audio a few years ago using the built-in oscillator and filter nodes which are actually quite capable when combined. Synth: http://www

I made a synth with web audio a few years ago using the built-in oscillator and filter nodes which are actually quite capable when combined. Synth: http://www.errozero.co.uk/stuff/poly/ http://www.errozero.co.uk/stuff/poly/ Source: https://github.com/errozero/poly-synth https://github.com/errozero/poly-synth Works best in chrome

capableweb 5y ago
Not sure what went wrong and I'm not sure about the exact measurements but your synth has huge input or output latency, maybe around 100ms or something like that? Other WASM/web synths I've tried doesn't suffer from the same problem. Otherwise it's a nifty little toy, thanks for sharing :) Lots of fun.
- apanloco 5y ago
  i don't have this issue! awesome synth! and i really like the tracker-style keys ;D
  - errozero 5y ago
    Thanks! :) Yeah the keyboard layout is based on the tracker style. I spent a lot of time with FastTracker 2.
- Ameo 5y ago
  Yeah some browsers/operating systems have worse latency issues than others with Web Audio. However, it's possible to tune the `latencyHint` a bit when constructing the `AudioContext` to specify a custom value. You have to find a balance between too low where have buffer underruns and miss samples and too high where it adds noticeable delay. After a good bit of trial and error, I came up with a setup that works well on all platforms I could test: https://github.com/Ameobea/web-synth/blob/master/src/index.hbs#L18 https://github.com/Ameobea/web-synth/blob/master/src/index.h...
delineator 5y ago
@errozero: I made a synth with web audio/midi based on your synth engine a few years ago: https://web-audio-midi.herokuapp.com/ https://web-audio-midi.herokuapp.com/ Adding a keyboard, scale selection, oscilloscope, score note viewer, sound font player, bluetooth/web midi controller detection, etc :) Did you decide on a license for your synth code?
- errozero 5y ago
  Cool, I like the split keyboard feature. I've not really thought about a license tbh, I'll look into which one would be best and add a note about that. I don't really mind what anyone does with it so maybe MIT would be the one.
  - delineator 5y ago
    Cool. Great to meet you virtually, btw. Your web audio synth is awesome. Adding the oscilloscope made me appreciate how your different patches generate their unique sounds. And I added a few preset patches I liked too.
- moron4hire 5y ago
  Umh, why don't the F or H keys work?
  - errozero 5y ago
    Because of the mapping of the typing keyboard to musical notes. F would represent E# which doesn't exist on a piano. H should work though. I found a pic that explains the keyboard layout better than I could: https://sourceforge.net/p/vmpk/shared-keymaps-and-instruments/_discuss/thread/808fc7f8/0cb2/attachment/trkeybmap.jpg https://sourceforge.net/p/vmpk/shared-keymaps-and-instrument...
    - moron4hire 5y ago
      Okay, that makes a lot more sense. I wasn't able to figure that out by just hitting the keys.
Ameo 5y ago
Nice stuff! I love your selection of presets. Since it looks like we're all sharing our web-based synthesizers, here's a FM synthesizer I built with Rust + Wasm with SIMD earlier this year: https://notes.ameo.design/fm.html https://notes.ameo.design/fm.html Blog post: https://notes.ameo.design/blog/fm-synth-rust-wasm-simd/ https://notes.ameo.design/blog/fm-synth-rust-wasm-simd/ I figured what I was working on was pretty niche; it's cool to see so many other people experimenting in this space too
chrismorgan 5y ago
Gets a bit crazy with an n-key rollover keyboard, hitting 31 notes simultaneously! But what happened to the F♯ that I expected on the = key, between [’s F and ]’s G? (Also since I’m writing something already, you’re serving your site on both HTTP and HTTPS and only some URLs are doing the appropriate 301 HTTP → HTTPS redirect, presumably because it’s being done at the Wordpress/PHP level, so any direct file references handled directly by Apache don’t get done. You should make it do all URLs, and ideally add an HSTS header.)

capableweb 5y ago

Not sure what went wrong and I'm not sure about the exact measurements but your synth has huge input or output latency, maybe around 100ms or something like that? Other WASM/web synths I've tried doesn't suffer from the same problem. Otherwise it's a nifty little toy, thanks for sharing :) Lots of fun.

apanloco 5y ago
i don't have this issue! awesome synth! and i really like the tracker-style keys ;D
- errozero 5y ago
  Thanks! :) Yeah the keyboard layout is based on the tracker style. I spent a lot of time with FastTracker 2.
Ameo 5y ago
Yeah some browsers/operating systems have worse latency issues than others with Web Audio. However, it's possible to tune the `latencyHint` a bit when constructing the `AudioContext` to specify a custom value. You have to find a balance between too low where have buffer underruns and miss samples and too high where it adds noticeable delay. After a good bit of trial and error, I came up with a setup that works well on all platforms I could test: https://github.com/Ameobea/web-synth/blob/master/src/index.hbs#L18 https://github.com/Ameobea/web-synth/blob/master/src/index.h...

delineator 5y ago

@errozero: I made a synth with web audio/midi based on your synth engine a few years ago: https://web-audio-midi.herokuapp.com/ https://web-audio-midi.herokuapp.com/ Adding a keyboard, scale selection, oscilloscope, score note viewer, sound font player, bluetooth/web midi controller detection, etc :) Did you decide on a license for your synth code?

errozero 5y ago
Cool, I like the split keyboard feature. I've not really thought about a license tbh, I'll look into which one would be best and add a note about that. I don't really mind what anyone does with it so maybe MIT would be the one.
- delineator 5y ago
  Cool. Great to meet you virtually, btw. Your web audio synth is awesome. Adding the oscilloscope made me appreciate how your different patches generate their unique sounds. And I added a few preset patches I liked too.
moron4hire 5y ago
Umh, why don't the F or H keys work?
- errozero 5y ago
  Because of the mapping of the typing keyboard to musical notes. F would represent E# which doesn't exist on a piano. H should work though. I found a pic that explains the keyboard layout better than I could: https://sourceforge.net/p/vmpk/shared-keymaps-and-instruments/_discuss/thread/808fc7f8/0cb2/attachment/trkeybmap.jpg https://sourceforge.net/p/vmpk/shared-keymaps-and-instrument...
  - moron4hire 5y ago
    Okay, that makes a lot more sense. I wasn't able to figure that out by just hitting the keys.

Ameo 5y ago

Nice stuff! I love your selection of presets. Since it looks like we're all sharing our web-based synthesizers, here's a FM synthesizer I built with Rust + Wasm with SIMD earlier this year: https://notes.ameo.design/fm.html https://notes.ameo.design/fm.html Blog post: https://notes.ameo.design/blog/fm-synth-rust-wasm-simd/ https://notes.ameo.design/blog/fm-synth-rust-wasm-simd/ I figured what I was working on was pretty niche; it's cool to see so many other people experimenting in this space too

chrismorgan 5y ago

Gets a bit crazy with an n-key rollover keyboard, hitting 31 notes simultaneously! But what happened to the F♯ that I expected on the = key, between [’s F and ]’s G? (Also since I’m writing something already, you’re serving your site on both HTTP and HTTPS and only some URLs are doing the appropriate 301 HTTP → HTTPS redirect, presumably because it’s being done at the Wordpress/PHP level, so any direct file references handled directly by Apache don’t get done. You should make it do all URLs, and ideally add an HSTS header.)