Make sure that polyfill-ed worketl nodes never have a smaller buffer size than the one chosen by the polyfill

Author: oshoham

lib/p5.sound.js

@@ -72,6 +72,17 @@ define(function (require) {
       }
     }.bind(this);
 
+    // if the AudioWorkletNode is actually a ScriptProcessorNode created via polyfill,
+    // make sure that our chosen buffer size isn't smaller than the buffer size automatically
+    // selected by the polyfill
+    // reference: https://github.com/GoogleChromeLabs/audioworklet-polyfill/issues/13#issuecomment-425014930
+    if (this._workletNode instanceof ScriptProcessorNode) {
+      this._workletNode.port.postMessage({
+        name: 'bufferSize',
+        bufferSize: Math.max(this.bufferSize, this._workletNode.bufferSize)
+      });
+    }
+
     // for connections
     this.input = this._workletNode;
 

lib/p5.sound.js.map

@@ -11,11 +11,8 @@ class AmplitudeProcessor extends AudioWorkletProcessor {
     this.numInputChannels = processorOptions.numInputChannels || 2;
     this.normalize = processorOptions.normalize || false;
     this.smoothing = processorOptions.smoothing || 0;
-    this.bufferSize = processorOptions.bufferSize || 2048;
 
-    this.inputRingBuffer = new RingBuffer(this.bufferSize, this.numInputChannels);
-    this.outputRingBuffer = new RingBuffer(this.bufferSize, this.numOutputChannels);
-    this.inputRingBufferArraySequence = new Array(this.numInputChannels).fill(null).map(() => new Float32Array(this.bufferSize));
+    this.setBufferSize(processorOptions.bufferSize || 2048);
 
     this.stereoVol = [0, 0];
     this.stereoVolNorm = [0, 0];
@@ -28,10 +25,19 @@ class AmplitudeProcessor extends AudioWorkletProcessor {
         this.normalize = data.normalize;
       } else if (data.name === 'smoothing') {
         this.smoothing = Math.max(0, Math.min(1, data.smoothing));
+      } else if (data.name === 'bufferSize') {
+        this.setBufferSize(data.bufferSize);
       }
     };
   }
 
+  setBufferSize(bufferSize) {
+    this.bufferSize = bufferSize;
+    this.inputRingBuffer = new RingBuffer(this.bufferSize, this.numInputChannels);
+    this.outputRingBuffer = new RingBuffer(this.bufferSize, this.numOutputChannels);
+    this.inputRingBufferArraySequence = new Array(this.numInputChannels).fill(null).map(() => new Float32Array(this.bufferSize));
+  }
+
   // TO DO make this stereo / dependent on # of audio channels
   process(inputs, outputs) {
     const input = inputs[0];

lib/p5.sound.min.js

@@ -20,10 +20,17 @@ class RecorderProcessor extends AudioWorkletProcessor {
         this.record(data.duration);
       } else if (data.name === 'stop') {
         this.stop();
+      } else if (data.name === 'bufferSize') {
+        this.setBufferSize(data.bufferSize);
       }
     };
   }
 
+  setBufferSize(bufferSize) {
+    this.bufferSize = bufferSize;
+    this.clear();
+  }
+
   process(inputs) {
     if (!this.recording) {
       return true;

lib/p5.sound.min.js.map

@@ -7,7 +7,18 @@ class SoundFileProcessor extends AudioWorkletProcessor {
     super();
 
     const processorOptions = options.processorOptions || {};
-    this.bufferSize = processorOptions.bufferSize || 256;
+    this.setBufferSize(processorOptions.bufferSize || 256);
+
+    this.port.onmessage = (event) => {
+      const data = event.data;
+      if (data.name === 'bufferSize') {
+        this.setBufferSize(data.bufferSize);
+      }
+    };
+  }
+
+  setBufferSize(bufferSize) {
+    this.bufferSize = bufferSize;
     this.inputRingBuffer = new RingBuffer(this.bufferSize, 1);
     this.inputRingBufferArraySequence = [new Float32Array(this.bufferSize)];
   }

src/amplitude.js

@@ -83,11 +83,13 @@ define(function (require) {
     this._inputChannels = 2;
     this._outputChannels = 2; // stereo output, even if input is mono
 
+    const workletBufferSize = 1024;
+
     this._workletNode = new AudioWorkletNode(ac, processorNames.recorderProcessor, {
       outputChannelCount: [this._outputChannels],
       processorOptions: {
         numInputChannels: this._inputChannels,
-        bufferSize: 1024
+        bufferSize: workletBufferSize
       }
     });
 
@@ -101,6 +103,17 @@ define(function (require) {
       }
     }.bind(this);
 
+    // if the AudioWorkletNode is actually a ScriptProcessorNode created via polyfill,
+    // make sure that our chosen buffer size isn't smaller than the buffer size automatically
+    // selected by the polyfill
+    // reference: https://github.com/GoogleChromeLabs/audioworklet-polyfill/issues/13#issuecomment-425014930
+    if (this._workletNode instanceof ScriptProcessorNode) {
+      this._workletNode.port.postMessage({
+        name: 'bufferSize',
+        bufferSize: Math.max(workletBufferSize, this._workletNode.bufferSize)
+      });
+    }
+
     /**
      *  callback invoked when the recording is over
      *  @private