web audio api: brief introduction
TRANSCRIPT
![Page 1: Web Audio API: brief introduction](https://reader031.vdocuments.mx/reader031/viewer/2022021500/5871ff471a28ab176b8b4c31/html5/thumbnails/1.jpg)
Mikhail Larchanka
github: larchanka twitter: MLarchanka
![Page 2: Web Audio API: brief introduction](https://reader031.vdocuments.mx/reader031/viewer/2022021500/5871ff471a28ab176b8b4c31/html5/thumbnails/2.jpg)
Web Audio API
![Page 3: Web Audio API: brief introduction](https://reader031.vdocuments.mx/reader031/viewer/2022021500/5871ff471a28ab176b8b4c31/html5/thumbnails/3.jpg)
![Page 4: Web Audio API: brief introduction](https://reader031.vdocuments.mx/reader031/viewer/2022021500/5871ff471a28ab176b8b4c31/html5/thumbnails/4.jpg)
<audio></audio>
![Page 5: Web Audio API: brief introduction](https://reader031.vdocuments.mx/reader031/viewer/2022021500/5871ff471a28ab176b8b4c31/html5/thumbnails/5.jpg)
<audio></audio>
• not cross-browser • no proper control • no pre-buffering • no effects • no sound analysing
![Page 6: Web Audio API: brief introduction](https://reader031.vdocuments.mx/reader031/viewer/2022021500/5871ff471a28ab176b8b4c31/html5/thumbnails/6.jpg)
Web Audio API
![Page 7: Web Audio API: brief introduction](https://reader031.vdocuments.mx/reader031/viewer/2022021500/5871ff471a28ab176b8b4c31/html5/thumbnails/7.jpg)
Web Audio API: ~cross-browser
![Page 8: Web Audio API: brief introduction](https://reader031.vdocuments.mx/reader031/viewer/2022021500/5871ff471a28ab176b8b4c31/html5/thumbnails/8.jpg)
![Page 9: Web Audio API: brief introduction](https://reader031.vdocuments.mx/reader031/viewer/2022021500/5871ff471a28ab176b8b4c31/html5/thumbnails/9.jpg)
![Page 10: Web Audio API: brief introduction](https://reader031.vdocuments.mx/reader031/viewer/2022021500/5871ff471a28ab176b8b4c31/html5/thumbnails/10.jpg)
Web Audio API: control
![Page 11: Web Audio API: brief introduction](https://reader031.vdocuments.mx/reader031/viewer/2022021500/5871ff471a28ab176b8b4c31/html5/thumbnails/11.jpg)
Web Audio API: control – source
![Page 12: Web Audio API: brief introduction](https://reader031.vdocuments.mx/reader031/viewer/2022021500/5871ff471a28ab176b8b4c31/html5/thumbnails/12.jpg)
Web Audio API: control – analyser
![Page 13: Web Audio API: brief introduction](https://reader031.vdocuments.mx/reader031/viewer/2022021500/5871ff471a28ab176b8b4c31/html5/thumbnails/13.jpg)
Web Audio API: control – destination
![Page 14: Web Audio API: brief introduction](https://reader031.vdocuments.mx/reader031/viewer/2022021500/5871ff471a28ab176b8b4c31/html5/thumbnails/14.jpg)
Web Audio API: pre-buffering
![Page 15: Web Audio API: brief introduction](https://reader031.vdocuments.mx/reader031/viewer/2022021500/5871ff471a28ab176b8b4c31/html5/thumbnails/15.jpg)
Web Audio API: effects (http://webaudioapi.com/samples/room-effects/)
•Overdrive•Filter•Cabinet•Delay•Convolver (Reverb)•Compressor•WahWah•Tremolo•Phaser•Chorus•Bitcrusher•Moog Filter•Ping Pong Delay•Panner•Gain
![Page 16: Web Audio API: brief introduction](https://reader031.vdocuments.mx/reader031/viewer/2022021500/5871ff471a28ab176b8b4c31/html5/thumbnails/16.jpg)
Web Audio API: analyse (http://webaudioapi.com/samples/visualizer/)
![Page 17: Web Audio API: brief introduction](https://reader031.vdocuments.mx/reader031/viewer/2022021500/5871ff471a28ab176b8b4c31/html5/thumbnails/17.jpg)
Code (http://jsbin.com/lenapigo/1/edit?html,css,js,output)
![Page 18: Web Audio API: brief introduction](https://reader031.vdocuments.mx/reader031/viewer/2022021500/5871ff471a28ab176b8b4c31/html5/thumbnails/18.jpg)
Links
• Web Audio API Mozilla.dev (https://developer.mozilla.org/en/docs/Web/API/Web_Audio_API)
• Howler.js (https://github.com/goldfire/howler.js)
• Pizzicato (https://github.com/alemangui/pizzicato)
• Wad (https://github.com/rserota/wad)
• http://codepen.io/njmcode/pen/PwaXwB
• https://mdn.github.io/voice-change-o-matic/
![Page 19: Web Audio API: brief introduction](https://reader031.vdocuments.mx/reader031/viewer/2022021500/5871ff471a28ab176b8b4c31/html5/thumbnails/19.jpg)
Questions