FFMPEG.js ?

[nvandamme]

Use FFMPEG.js to enable full clientside processing ?
https://github.com/Kagami/ffmpeg.js/
https://github.com/bilashcse/Online-Video-Editor

[daem-on]

Hi there!
Thanks for the suggestion, I'll try to respond as best as I can with what I know about these projects:

So the first repo (ffmpeg.js) is something I've looked into already, and I think what you mean under "full clientside processing" is a PWA that has all the functionality of my repo, fully in the browser, without Electron. That sounds great, and I'm really optimistic about the future of PWAs, but right now this project isn't really fit to be converted into one. Specifically it has three issues:

• This project uses fluent-ffmpeg which already handles creating new ffmpeg processes, so I couldn't use ffmpeg.js without a large amount of refactoring
• This project tries to offer consumer-grade editing, which requires handling very long videos. With the way PWAs stand right now, you don't have any permissions to the filesystem, you can only use files in memory, or Emscripten offers a database on disk you can access. Neither of these is remotely fit for handling large video files, which would be essential for this kind of video editing.
• The "preview" system I have right now works by having a web server stream the preview video to the editor client. This would be hard to achieve with a PWA setup with ffmpeg workers that can't stream data, only send messages.

This is the way I currently understand the situation, but if these are incorrect, please do respond and tell me.

The second repo (Online-Video-Editor) is functionally very similar to my repo, it only offers node.js-side editing (the Online part is a misnomer), it also uses fluent-ffmpeg and doesn't have any new information.

[nvandamme]

Hi,

Thanks for the quick reply !
These are very good points, it was a wild guess on my side.
Of course, refactoring to match this very different processing architecture will be complex.

Some hints, though.

For the stream and webworker part :

• Maybe a port of the node streams API can do it.
• There is a port that can be webified : https://github.com/maxogden/workerstream

For the native filesystem access :

• As i understand so far, using Electron or Cordova as a wrapper (as you do now) enable access to the native FS
• There seems to be a draft proposal about enabling sandboxed filesystem access for PWAs (with a user permission request scheme, à la Android) : https://web.dev/native-file-system/

(sorry for the second repo, bad editing on my side!)

Anyway, thanks for this great project !

[daem-on]

To be honest, I don't know much about streams, so I didn't know this was possible, but that project seems to be exactly what I need in this use case.

I also didn't know about this API proposal, but it specifically mentions video editors among others as a possible use case, so I hope it will be implemented soon.

As I've said, I'm very optimistic about PWAs in the future, but for the time being I don't think it would be a good idea for this project.

Thanks for the resources, I'll keep an eye on that proposal as well. 😃