I got fps error message in FireFox and Safari

Description
When I try to open the camera for 2 people then Firefox and Safari are started blinking and the console throw error fps error but for google chrome is fine no error can see the video as normal while other are blinking

Error
Safari

FireFox

Which Web Video SDK version?
video sdk 1.1.4

To Reproduce(If applicable)
Steps to reproduce the behavior:

  1. join a session in chrome and open the camera
  2. join a session another browser and open the camera

Device (please complete the following information):

  • Device: MacBook
  • OS: macOS Big Sur 11.2.2
  • Browser: Chrome v92, Firefox v91, Safari v14.0.3

Hey @nslog0 , thanks for sharing this.

Can you please provide a screen video of the issue?

Thanks,
Tommy

Hi @tommy ,
Here you go the screenshot

Sorry, I cannot capture when is blinking but in the picture is blinking (please imagine). in picture 1,2 is the state when the canvas started to blink. it switches between 1 and 2.

1

2

and this another one of error sometimes is not blinking but it render as pink

lastly, another question. as you see the canvas size of the video is not the same the small rectangle is a FF and the rectangle in 16:9 is Chrome. this error from how FF render or from my code itself? if you have a solution to fix please tell me. All my setting is 16:9 every browser

Hey @nslog0

Thanks for your feedback.

Firefox, Safari can not support rendering multiple videos on a single canvas. You can refer to the sample react app code for the detail about this case. sample-app-videosdk/video-single.tsx at master · zoom/sample-app-videosdk · GitHub

Thanks
Vic

Hi @vic.yang
Thank for you answer

So if I want to show multiple videos on the screen then I should create an individual canvas? it that right?

Hey @nslog0

That’s right. For Firefox and Safari, you should use individual canvas for each video.

Thanks
Vic

Hi @vic.yang @tommy,
I have question that refers to Are there any known issues with using multiple canvas elements for peer video streams? - #9 by vic.yang and Multiple videos instead of the active video in Video SDK

it seems both links talk about rendering video in a single canvas but as per my issue as @vic.yang mention the error is because of rendering multiple videos on a single canvas. so should or should not to render video in a single canvas and how to fix error then?

Hey @nslog0

On Firefox and Safari, we recommend that render video per canvas, and on Chrome and Edge, use a single canvas to render multiple videos.

Thanks
Vic

1 Like

@vic.yang thanks

On Firefox and Safari, how do you recommend checking whether Firefox or Safari or Chrome. I’m working on Vuejs but on you react example I try to get understand but it doesn’t have code to checking like that

Hey @nslog0

It depends on feature detection, Video SDK has exposed the stream.isSupportMultipleVideos() API for checking whether the browser supports rendering multiple videos.

Thanks
Vic

1 Like