WebRTC Performance - Very High CPU Usage

Question

Work on the js library motion detector is built with WebRTC + canvas. When I launch the application, I immediately get a very high processor performance. I optimized the loops, etc., but the main problem is access to the camera, for example, WebRTC.

Is there a way to make WebRTC behave better? Perhaps a different configuration? Or am I missing something? Could this be a js memory leak, am I processing it incorrectly? What am I doing wrong?

You can check another demo here with the same lib

and the other using WebRTC and with the same problem here

Answer 1

The demonstration is similar to motion detection by checking the pixels of a video image. It seems to display it on canvas and then retrieve the image data of the canvas.

This is slow because it is just slow work - there are many pixels, frames go through quickly, and this is a high processor load. This has been made worse by the fact that Javascript is not always very efficient at this kind of data processing. Therefore, I do not think that slowness is inherent in WebRTC. This is just heavy javascript.

Answer 2

Have you tried using Web Workers for calculation?

There is a demo using web workers to track movement (Firefox only). CPU utilization really seemed high in this demo, but the worker said that fps is the way to the video frame rate, so there might be some benefit to trying to limit the worker to 30 frames per second.