Picture-in-Picture freezes when window is no longer visible

Description
When the user alt+tabs from the browser window in which the Zoom video is being rendered, the Picture-in-Picture video freezes.

Which Web Video SDK version?
Javascript 1.12.5

Video SDK Code Snippets
See Additional Context below

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

  1. Open PiP with requestPictureInPicture()
  2. Go to another window/workspace, or anything that causes the browser to no longer be rendered
  3. The video inside the PiP window will freeze
  4. If you go back to the original window/workspace, the PiP video will unfreeze

Troubleshooting Routes
See Additional Context below

Device (please complete the following information):

  • Device: Dell XPS 13 Plus
  • OS: Linux 6.10.10-arch1-1
  • Browser: Chrome
  • Browser Version: 129.0.6668.70 (Official Build) (64-bit)

Additional context
Our use case is admittedly not standard. We use render video to a <canvas>, then we use captureStream() to get the videoTrack from it. Finally, we attach the track to a <video> in our custom UI. This is how we have been doing for Twilio, Daily and Vonage with success.
However, when doing this with Zoom video SDK, we get the PiP freeze mentioned in this topic.

An update: after some testing it seems the Picture-in-Picture does not freeze on all systems. We had people testing on Windows and it worked as expected. Not sure what could be cause this specific behavior in my system, but I’ll continue to investigate.

The freezing behavior you’re experiencing in the Picture-in-Picture (PiP) mode when using the Zoom Web Video SDK could be related to how the video rendering and stream capture are handled in combination with the PiP API. Here’s a possible explanation and troubleshooting approach:

Possible Cause:

  1. Rendering via <canvas> and captureStream(): Your custom setup, which renders video to a <canvas> and then captures the stream using captureStream() before attaching it to a <video>, might not handle off-screen rendering well when the browser window is no longer active. This could be causing the video to freeze in PiP mode.
  2. Browser Resource Management: When you alt-tab out, modern browsers sometimes throttle background tabs or minimize the resources used by elements not visible, such as <canvas> rendering. This could affect the requestPictureInPicture() functionality, leading to the freeze.
  3. Zoom SDK Integration: Unlike other video SDKs like Twilio, Daily, and Vonage, the Zoom SDK may have different handling mechanisms for PiP, particularly in cases where video is being processed through a <canvas> before being streamed.

Troubleshooting Suggestions:

  1. Direct Video Rendering:
  • Try bypassing the <canvas> and attaching the video track directly to a <video> element without using captureStream(). This will help determine if the issue is with the custom rendering pipeline.
  1. Test with Native Video Element:
  • Run a test by attaching the raw video stream from Zoom directly to a native <video> element and initiate PiP mode. If the video doesn’t freeze in this scenario, then the issue likely lies with the <canvas> and captureStream() flow.
  1. PiP API with Zoom SDK:
  • Check if the Zoom Web Video SDK has specific compatibility notes or restrictions when working with PiP mode. It’s possible that the SDK’s handling of video streams may differ in edge cases like PiP.
  1. Throttling Issues in Background Tabs:
  • Investigate whether Chrome’s resource management for background tabs is affecting the PiP video. You can try temporarily disabling throttling by navigating to chrome://flags and modifying settings like “Throttle expensive background timers” or “Throttle JavaScript timers in background.”
  1. Check for SDK or Browser Updates:
  • Ensure you’re using the latest Zoom Web Video SDK (in this case, version 1.12.5) and Chrome. Occasionally, PiP handling issues are resolved with browser or SDK updates.
  1. Alternative PiP Implementation:
  • If none of the above steps resolve the issue, consider handling PiP directly within your custom UI, using a small floating <video> element that mimics PiP behavior without relying on requestPictureInPicture().

The freezing behavior you’re experiencing in the Picture-in-Picture (PiP) mode when using the Zoom Web Video SDK could be checkec Calculadora De Horas