[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]

[Public WebGL] Video capture



A requirement that I have encountered a few times now is the need to produce a video from the canvas content. In my case, it usually was in order to save this video to disk. Another usecase mentioned by Ben Adams is a bit more generic (not just a canvas) and more aimed at being able to stream the video via WebRTC and the like.

There are some libraries perform this task for canvas, such as:

https://github.com/spite/ccapture.js
https://github.com/antimatter15/whammy

However they usually suffer from low speed (JS only encoding), incompleteness (no interframe compression and only basic intraframe compression) and so are not suitable for substantial video lengths and produce bulky files.

A desirable solution would provide the following characteristics:

* Fast to encode (preferrably realtime, i.e. < 8ms/frame)
* Achieves good compression
* If possible makes use of hardware supported video encoding found in some GPUs
* Should at a minimum be able to capture canvas (but if possible a broader range of elements)
* Should be amenable to progressive encoding (i.e. not block during an encoding task so that an application can be interactively used and simultaneously video encoding is operated)

Usecases for this functionality can include:

* Web based 3D editors and rendering movies
* Web based video compositors
* Collaboration tools (presentation, authoring, etc.)
* Generally productivity tools of any kind whose output may contain video