Web Audio API-删除过滤器

Question

I'm building a visualiser with multiple graphic modes. For a few of them I need to calculate the beat of the track being played, and as I understand I then need to apply a lowpass filter like the following, to enhance frequencies that are most probable to hold drum sounds:

var filter = context.createBiquadFilter();

source.connect(filter);
filter.connect(context.destination);

filter.type = 'lowpass';

But what if I want to turn the filter off? Do I have to re-connect the source every time I need to remove the filter? Would this have any negative effect on performance?

Related question: how much performance loss would I experience if I have two two sources, from the same audio source, and apply the filter to one of them?

Answer 1

According to article WebAudio intro | html5rocks , I would have to toggle the filter on and off, by disconnecting the source and itself like so:

  this.source.disconnect(0);
  this.filter.disconnect(0);
  // Check if we want to enable the filter.
  if (filterShouldBeEnabled) {
    // Connect through the filter.
    this.source.connect(this.filter);
    this.filter.connect(context.destination);
  } else {
    // Otherwise, connect directly.
    this.source.connect(context.destination);
  }

Answer 2

how much performance loss would I experience if I have two two sources, from the same audio source, and apply the filter to one of them

You can connect a single audio node to multiple destinations, thus you never need a duplicate source just to spread-connect it. If you need filtered and raw audio simultaneously, you can just setup your connections accordingly:

var filter = context.createBiquadFilter();

source.connect(filter);
source.connect(context.destination);
filter.connect(context.destination);

filter.type = "lowpass";

---

Anyways, setting the type property of a FilterNode to "allpass" will effectively disable all filtering, without having to reconnect:

filter.type = "allpass"