Too many web contexts error

Video SDK
1

zoom video sdk for web 1.9.8 with c# (mvc) and pure js

Currently I have an application that you can toggle on and off your camera. Every new user that joins is assigned their unique ID so I can open multiple tabs and toggle the webcam so I can simulate a video chat room full of people. The problem is when I get to around 5 or 6 active video cameras I get the error in the console:
WARNING: Too many active WebGL contexts. Oldest context will be lost.
o.initContextGL webglcontextlost WebGLContextEvent {isTrusted: true, statusMessage: ‘’, type: ‘webglcontextlost’, target: OffscreenCanvas, currentTarget: OffscreenCanvas, …}

This is accompanied by freezing that specific canvas object across all tabs, and not rendering it at all on newly opened tabs…

When someone toggles their camera it creates a new canvas element for all users and renders their respective video camera, am I utilising the render video the wrong way? or do I need to create a single canvas object that dynamically updates depending on is users join/toggle their cameras, if so, is there an easy way to do this with the zoom video sdk?

Any pointers are greatly appreciated

2

Hey @seb

Thanks for your feedback.

When someone toggles their camera it creates a new canvas element for all users and renders their respective video camera

For a new canvas, we create its WebGL context to accelerate video rendering. However, browsers have limitations on the number of WebGL contexts, so we recommend using CSS to hide and show the canvas instead of destroying and recreating it in DOM form.

Thanks
Vic