π JS SDK v1.0.11: Buffer Overflow / MessageEvents Support
Release date: 18 July, 2023
What's New
β New functionality
MessageEvents Support in FilterNode
The FilterNode now supports MessageEvents
. This means that the ready
and dispose
events can now be handled using event listeners instead of being passed as a callback (although the callback version is still supported).
Available events are: ready
, dispose
, buffer_overflow
Below is the sample of MessageEvents
usage.
filterNode = await krispSDK.createNoiseFilter(audioContext);
filterNode.addEventListener('ready', (event) => {
// Fired when filterNode is ready to proceed with audio data.
filterNode.enable();
});
filterNode.addEventListener('dispose', (event) => {
// Fired when filterNode was disposed
});
System Overload Handling
When the system experiences high load, the JS SDK may malfunction and result in choppy voice output. To address this issue, we recommend implementing the buffer_overflow
scenario.
During initialization, set the bufferOverflowMS
property to a value between 50-250 to determine the acceptable delay due to overload. The default and recommended value is 200ms, but you can adjust it according to your preference. The buffer_overflow
event will be emitted each time the buffer difference between the previously emitted value reaches the configured value.
If the buffer keeps growing and no action is taken on the application layer, the JS SDK will drop the buffer after 500ms and emit the buffer_overflow
event once again.
Below is a code sample that demonstrates how to configure and listen for the buffer_overflow
event.
const krispSDK = new KrispSDK({
params: {
...
bufferOverflowMS: 200
}
});
const filterNode = await krispSDK.createNoiseFilter(audioContext);
filterNode.addEventListener('buffer_overflow', (event) => {
// event.data.overflowCount - count of buffer overflow occurrences after filterNode is enabled.
// event.data.bufferSizeMS - current buffer size in ms
// event.data.isBufferDopped - indicates if buffer was dropped due to overflow. Max buffer size is 500ms; it will start dropping once it reaches 500ms.
});
Application Scenario
Below is the application scenario example that you can take to deal with overflow event.
let overflowTimer;
filterNode.addEventListener('buffer_overflow', (e) => {
// cleaning previously set timer.
clearTimeout(overflowTimer);
const count = e.data.overflowCount;
// disabling Noise cancellation each time buffer_overflow occured
filterNode.disable();
// 3 attempts to resume krisp with 2x growing wait time interval
// Initial wait time 20 sec.
// In case the system is under load buffer_overflow will trigger once again.
if (count < 4) {
const waitTime = 10 * (2 ** count) * 1000;
overflowTimer = setTimeout(() => {
if (filterNode) filterNode.enable();
}, waitTime);
}
});