search

josephrocca / getVideoFrames.js

Simple JavaScript library to break a video down into individual frames (uses WebCodecs API and MP4Box.js)
MIT License
38 stars 4 forks source link

Crashing with large MP4 files #1

Closed pedrobroese closed 1 year ago

pedrobroese commented 1 year ago

Hi Joseph, congrats for your great work! I've been developing a project where the user selects a GoPro video (source) and then some gauges are animated over the video on a canvas, firstly to display for the user, but later I would also like to render a new mp4 file for the user to download. In order to have proper control over the frame rate of the resulting video and precisely animate the gauges, my plan is to get the source video frames individually, draw the gauges over each frame and then generate a new video with the set of frames. For that, your libraries are very handy, however, I can't load big files, because it causes chrome and edge to crash. Any idea of a workaround for that so I can load big files?

josephrocca commented 1 year ago

Hmm - how big before it crashes? Can you determine the cut-off size? I think your first step is to work out where the source of the crash is specifically coming from. Try loading your file with the mp4box.js demos to see if that crashes: https://gpac.github.io/mp4box.js/test/filereader.html

If that works, then copy mod.js locally and add some console.log to see how far it gets, and where it gets to before crashing.

If it crashes the mp4box.js demos, then it might be worth posting an issue on the mp4box.js repo: https://github.com/gpac/mp4box.js/ Make sure to try the mp4box.js demos in a couple of different browsers.

pedrobroese commented 1 year ago

OK Joseph, thanks for the feedback. I acctually found the limit and it is really mp4 box related. Whenever the box file that mp4 creates reaches 4GB it crashes. What I ended up doing is using a different approach to reach the file frames by using the video.requestVideoFrameCallback() method, which suited my application very well:

https://web.dev/requestvideoframecallback-rvfc/