# WebGLContextLost - Multiple Canvas

**URL:** <https://devforum.zoom.us/t/webglcontextlost-multiple-canvas/78448>\
**Category:** Web\
**Created:** [November 8, 2022, 7:45am UTC](https://devforum.zoom.us/t/webglcontextlost-multiple-canvas/78448 "2022-11-08T07:45:43Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![ashish.beetle](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/ashish.beetle/32/40136_2.png) [@ashish.beetle](https://devforum.zoom.us/u/ashish.beetle)\
**Post date:** [November 8, 2022, 7:45am UTC](https://devforum.zoom.us/t/webglcontextlost-multiple-canvas/78448/1 "2022-11-08T07:45:43Z")

</div>

Continuing the discussion from [WebGLContextLost](https://devforum.zoom.us/t/webglcontextlost/62238):

Hi  
I am facing the same issue reported above. I need to render multiple participants on multiple canvases as per our requirement.

When i try to switch video feed from one canvas to another a few times, I get the following error:

> Too many active WebGL contexts. Oldest context will be lost.

> webglcontextlost WebGLContextEvent

SDK Version:  
1.5.1

**To Reproduce**  
Steps to reproduce the behavior:

1. Create two canvases with 2 different video streams
2. switch the video streams between the canvases multiple times

**Screenshots**  
 ![webgl](https://us1.discourse-cdn.com/flex016/uploads/zoomdeveloper/original/3X/8/1/81d5db9467557f0b68068a958efd58d4116b9e49.jpeg)

**Device (please complete the following information):**  
OS: Windows  
Browser: Chrome - version: 107.0.5304.88

Have you found any solution/workaround for the bug ?

Thanks  
Ashish

---

<div class="post-metadata">

**Author:** ![ALanois](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/alanois/32/33827_2.png) [@ALanois](https://devforum.zoom.us/u/ALanois)\
**Post date:** [November 8, 2022, 8:17am UTC](https://devforum.zoom.us/t/webglcontextlost-multiple-canvas/78448/2 "2022-11-08T08:17:50Z")

</div>

Hi

After a moment of research, I understood that i won’t be able to reach the expected results because of the problem you are facing.  
But it’s been almost a year since I posted my issue, and it seems that you can now display stream in video element :

> **[Video](https://marketplace.zoom.us/docs/sdk/video/web/essential/video/)**
>
> The Zoom Developer Platform is an open platform that allows third-party developers to build applications and integrations upon Zoom’s video-first unified communications platform.

I replaced Zoom by Jitsi which is using video element to display stream and I never met limitations due to performance.

Hope it will help you

---

<div class="post-metadata">

**Author:** ![ashish.beetle](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/ashish.beetle/32/40136_2.png) [@ashish.beetle](https://devforum.zoom.us/u/ashish.beetle)\
**Post date:** [November 10, 2022, 1:26pm UTC](https://devforum.zoom.us/t/webglcontextlost-multiple-canvas/78448/3 "2022-11-10T13:26:14Z")

</div>

Hi @ALanois

Thanks for the info. If it is not inconvenient, could you please describe the issues that you faced due to this error? I am still working on a test server within a controlled environment. As such the impact is minimal for now. It would be helpful if you can share your experience so that I can be better prepared for production release.

Thanks  
Ashish

---

<div class="post-metadata">

**Author:** ![ALanois](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/alanois/32/33827_2.png) [@ALanois](https://devforum.zoom.us/u/ALanois)\
**Post date:** [November 10, 2022, 1:51pm UTC](https://devforum.zoom.us/t/webglcontextlost-multiple-canvas/78448/4 "2022-11-10T13:51:38Z")

</div>

Hi @ashish.beetle

Here is my issue:  
I needed to display each participant in a separate canvas to get more customization capabilities like rounded video and moving them from top to bottom based on the last speakers.

When 2 or 3 participants were in the room, there was no problem to have couples of canvas in the page, but when more participants joined the browser sent error due to WebGlContextLost which come when your browser consumes too much from your CPU.

I tried to remove hidden canvas instead of hiding them with style to limit CPU consumption, but when a canvas is created, it comes with a WebGlContext which is not destroyed when the canvas is removed from the DOM.

Video element doesn’t have that kind of limitation, that’s why I go for this solution.

---

<div class="post-metadata">

**Author:** ![vic.yang](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/vic.yang/32/24656_2.png) [@vic.yang](https://devforum.zoom.us/u/vic.yang)\
**Post date:** [November 11, 2022, 7:34am UTC](https://devforum.zoom.us/t/webglcontextlost-multiple-canvas/78448/5 "2022-11-11T07:34:57Z")

</div>

Hey @ashish.beetle @ALanois

Thanks for sharing your experience with Video SDK Web.

[Remotion](https://remotion.webflow.io/), using the Video SDK Web in their application, shared a way how to render remote user video streams. [Our quest to build Zoom in web: 3 treasure chests we unlocked along the way](https://remotion.webflow.io/blog/building-zoom-in-web)

Hope this article will give you some help.

Thanks  
Vic

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex016/uploads/zoomdeveloper/original/3X/6/1/614bdd549b610bbaa46ff934617683a02bdaa03c.png) [@system](https://devforum.zoom.us/u/system)\
**Post date:** [December 11, 2022, 5:35pm UTC](https://devforum.zoom.us/t/webglcontextlost-multiple-canvas/78448/6 "2022-12-11T17:35:55Z")

</div>

Closed on December 11, 2022, 5:35pm UTC

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.
