twilio / twilio-video-processors.js

Twilio Video Processors is a collection of video processing tools which can be used with Twilio Video JavaScript SDK to apply transformations and filters to a video track.
Other
33 stars 21 forks source link

GaussianBlurBackgroundProcessor doesn't work with offscreencanvas on Safari 16.4+; Significant memory usage error #59

Open pzubar opened 1 year ago

pzubar commented 1 year ago

Although Safari 16.4 supports OffscreenCanvas API and the VirtualBackgroundProcessor does its job, after switching to GaussianBlurBackgroundProcessor video becomes unprocessed. Moreover, after some time of using any processor with inputFrameBufferType: 'offscreencanvas', Safari shows the "This web page was reloaded because it was using significant memory" error and reloads the page.

Also, sometimes "VirtualBackgroundProcessor" shows only the background, not the person (I have no specific steps to reproduce, it seems to happen randomly after changing the video quality or processor, etc).

image

Code to reproduce the issue:

...
let blurProcessor = new GaussianBlurBackgroundProcessor({
  assetsPath: '/tflite',
  blurFilterRadius: 10,
  maskBlurRadius: 1,
  pipeline: Pipeline.Canvas2D,
  debounce: isSafari() // true
});
await blurProcessor.loadModel();
...
videoTrack.addProcessor(blurProcessor, {
    inputFrameBufferType: typeof OffscreenCanvas === 'undefined' ? 'canvas' : 'offscreencanvas',
    outputFrameBufferContextType: '2d',
};

Expected behavior:

Processed (blurred) video is shown. No error is shown. The page is not reloaded. A person is shown altogether with a virtual background.

Actual behavior:

The video is not blurred. The page is reloaded showing the "This web page was reloaded because it was using significant memory" error. A person is not shown.

Software versions:

Talb2005 commented 1 year ago

Any update on this?