screen-share / element-capture

https://screen-share.github.io/element-capture/
19 stars 6 forks source link

Non-realtime recording of an element #41

Closed Technickel-Dev closed 10 months ago

Technickel-Dev commented 10 months ago

Is there a way to get a faster than realtime capture of an element? Much like the issue set out in Ability to record non-realtime / frame-by-frame for the MediaStream Recording API, taking the track from element capture and piping it into a MediaRecorder gives a realtime video (ie. it realistically takes around 10 seconds of recording an element to get around 10 seconds of video output)

The working solution for that thread shows manual manipulation of the frame capture of the canvas element and muxing the frames back into the final video. In the element capture case, we don't have a handy track.requestFrame() to manipulate as that only exists on the CanvasCaptureMediaStreamTrack and avoiding working exclusively in the world of canvas is ideal.

Use Case

I'm using element capture as a way to make user generated videos based on the current layout of the element. When the element being captured is in the state the user is happy with they COULD wait the entire duration of the recording but I believe there should be a way to go faster.

Attempts

I've played around with doing a similar setup to the aforementioned solution and using requestAnimationFrame to force an animation to play in faster than realtime in a theoretically similar fashion but have had no direct luck.

Another train of thought I had was using a single frame and duplicating it out into a video but that would ultimately not support different animations that would enhance the element that was being captured.

Looking forward to seeing what others come up with or if this sort of functionality could be capable!

eladalon1983 commented 10 months ago

Is there a way to get a faster than realtime capture of an element?

That's not currently in scope for the API. Element Capture will, for the time being, capture at the frame rate which the original capture had. (But how about you call getDisplayMedia() with a higher frame rate and speed that up in post?)

Technickel-Dev commented 10 months ago

Very fair! Keep up the great work, loving the API and I appreciate the suggestion!