你可以看到，它使用了三个节点：作为源输入的 {{domxref ("OscillatorNode")}} ，作为音量控制的 {{domxref ("GainNode")}}，以及作为音源输出的 {{domxref ("GainNode")}} 。Web 音频编辑器在 Firefox 32 推出。
开发者通过 Web Audio API 可以创建 {{domxref ("AudioContext", "audio context")}}。在该上下文环境中，开发者可以构建多个 {{domxref ("AudioNode", "audio nodes")}}，它们包括:
每个节点可能没有也可能具有多个 可以配置它们的行为的 {{domxref ("AudioParam")}} 属性。例如，{{domxref ("GainNode")}} 这个节点拥有一个 gain 属性，而 {{domxref ("OscillatorNode")}} 节点则拥有 frequency 和detune 两个属性。
开发者可以在图像中连接每个节点，而整个图像则定义了音频流的行为。
Web 音频编辑器检测创建于页面中的音频上下文环境，然后提供一个可视化的图像，从高可视化角度帮助您查看 Web 音频编辑器的操作，也使您能够确认每一个节点都以您的语预期连接在一起。然后您可以检测并编辑每一个图像中的节点 AudioParam 属性。部分不是 AudioParam 的属性也会显示出来，如 OscillatorNode 的 type 属性，您同样可以编辑这些属性。
这个工具仍然处于实验阶段。如果您发现了问题，欢迎您到 Bugzilla 提交这些问题。如果您希望反馈信息或者提供新特征的建议，请您到 ffdevtools.uservoice.com 或者 Twitter 提交这些信息。
在 Firefox 32 的默认条件下 Web 音频编辑器并没启用，您可以打开 开发者工具 然后勾选"Web 音频"来启用 Web 音频编辑器。现在，在 开发者工具栏 那里会多出一个"Web音频“选项卡。点击这个选项卡，然后加载创建了音频上下文环境的页面。 这里有两个演示：
Web 音频编辑器现在可以显示一张加载完成后的音频上下文环境的图像。下图是 Violent Theremin 演示的图像：
你可以看到，它使用了三个节点：作为源输入的 {{domxref ("OscillatorNode")}} ，作为音量控制的 {{domxref ("GainNode")}}，以及作为音源输出的 {{domxref ("GainNode")}} 。
显示与 AudioParams 连接的功能在 Firefox 34 版本中推出。
我们使用了直线线条来显示节点与节点之间的连接。然而，如果你把一个节点连接到了另一个节点的 AudioParam，那么这两个节点之间的连接将显示为一条虚线，并且标记了 AudioParam 的属性名称：
如果你点击了一个节点，这个节点将被高亮，然后在右手边你将看到一个节点查看器。这个节点检查器列出了当前节点的 AudioParam 各个属性的值。例如，下图显示的是 OscillatorNode 节点:
当用户的鼠标左右移动的时候，Violent Theremin 会随之修改 frequency 参数，您可以在节点查看器中查看到新的参数值。但是，这个参数值并非实时更新：您必须再次点击节点，才能看到更新后的值。
如果您在节点检查器中点击了某一个属性值，那么你就可以修改这个属性值：按下回车或者 Tab 键就可以使新的属性值立即生效。