Skip to content

Comments

fix: reduce WebGL ReadPixels GPU stalls in video source capture#510

Closed
livepeer-tessa wants to merge 1 commit intomainfrom
fix/issue-509
Closed

fix: reduce WebGL ReadPixels GPU stalls in video source capture#510
livepeer-tessa wants to merge 1 commit intomainfrom
fix/issue-509

Conversation

@livepeer-tessa
Copy link

Summary

Fixes #509 — WebGL performance warnings ("GPU stall due to ReadPixels") in the Playground 3D view.

Root Cause

useVideoSource.ts was drawing video frames to a canvas via requestAnimationFrame (~60fps) while captureStream(fps) captured at a lower rate (e.g. 15fps). This mismatch caused the browser to perform synchronous ReadPixels calls at ~60fps, triggering GPU stalls.

Fix

  • Use captureStream(0) (manual frame capture mode) instead of captureStream(fps)
  • Replace requestAnimationFrame with setInterval at the target FPS rate
  • Manually call videoTrack.requestFrame() after each draw, so canvas readback only happens at the intended capture rate
  • Added cleanup: interval clears when video pauses/ends or when the track ends

This reduces canvas readback frequency from ~60fps to the target FPS (default 15), eliminating the GPU stall warnings.

Replace requestAnimationFrame + captureStream(fps) with
setInterval + captureStream(0) + manual requestFrame(). This ensures
canvas drawing only happens at the target FPS rate, eliminating the
mismatch between ~60fps draws and lower-rate captures that caused
'GPU stall due to ReadPixels' warnings.

Fixes #509
@livepeer-tessa
Copy link
Author

Closing - wrong codebase. The WebGL issue was on the web platform, not desktop app.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Web Platform: WebGL performance warnings in Playground 3D view

1 participant