Web Audio API Overview

[00:00:00]
>> Little bit about the Web Audio API itself, what it is, how it sort of works. I like to think of it as if you're a somebody had a switchboard maybe,. And you've got all these wires and you're taking them from one place and you're putting them into another place.

[00:00:14]
All of a sudden you have to change the signal, unplug it and plug it in somewhere else. You're basically just rerouting the signal from one source to another. And with Web Audio it's kind of similar. We're given these little nodes that are kind of like Lego building blocks for audio.

[00:00:30]
It might be something like a microphone node which is an audio node and that's going to give us the signal from our microphone. And then we're gonna have maybe a speaker like a destination node so that's the output. And by just wiring those two things together, we can go from a microphone to a speaker and basically have it so that anything we put through the microphone is emitted by the speaker.

[00:00:54]
Or instead of using a microphone as a source, we can use an MP3 file or a WAV file or some sort of media asset basically. Here's a little bit more of a complicated graph here. This would be taking your MP3 file, wiring it through an effect, like maybe a delay, or some sort of distortion or reverb.

[00:01:14]
And then continuing along and wiring that through to the speaker so that we have some sort of effect. Or a typical thing that we do when we're visualizing audio, is that we split it up like this where we are analyzing the MP3 file. And at the same time, we're also giving the MP3 file some effects and then outputting that to the speaker.

[00:01:37]
And just the other way around is totally possible as well where you have many things directed into a single node. So a good example of this is when you have lots of layered sounds to create a really rich and dynamic atmosphere, but then you wanna have one master node.

[00:01:53]
Something that is able to control the gain and control the volume for all of those things that you're putting into it and so that's how that might look here.