captaindev404 / fwf

HTML video editor with FFmpeg

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

fwf: FFmpeg video editor

If you are a consumer considering using this software, don't. This was an experiment and important features don't work or are missing. Olive is an open source video editor that you may be interested in. Read the Inherent problems section for more information.

main screenshot

Video editing software in JavaScript, made with Electron, on top of FFmpeg using fluent-ffmpeg. Provides a simple GUI for editing videos with FFmpeg with a timeline, preview, and filter editor.

Architecture:

  • Fluent-ffmpeg in the main process, starting ffmpeg processes as needed.
  • GUI in the renderer process, stores all of the information and only sends render instructions to main over IPC.
  • Express HTTP server in main process for streaming preview video.

Filter editor

filter editor screenshot

JSON editor GUI using jsoneditor, with presets. This lets you edit the filters that are passed to fluent-ffmpeg, which then turns them into FFmpeg options. This means you can use any video filter the FFmpeg binary supports.

Inherent problems

This was an experiment to see if a consumer grade video editor is possible to make with HTML and JavaScript. I would say it is possible, the result just isn't very good. It's also obviously not pure JavaScript, since it uses FFMpeg as a backend. Problems:

  1. Previews are slow, unreliable and limited, because the preview is rendered in FFMpeg and streamed through an internal server to the renderer. I also haven't been able to implement the streams feature, which would make it capable of rendering multiple clips chained together for the preview.
  2. FFMpeg wasn't designed for a consumer grade video editing app. HTML & JavaScript weren't designed for making desktop apps.
  3. The FFMpeg binary has to be bundled with the app for easier installation, and this means using a custom build configuration. Into this custom configuration I haven't been able to integrate the Vue compilation that would be necessary to make the interface entirely Vue-based.

If you would like to use it anyway, you're free to do so. If you would like to help out with the development, PRs are greatly appreciated.

License

Released under the MIT license, see LICENSE.

splash

About

HTML video editor with FFmpeg

License:MIT License


Languages

Language:JavaScript 88.0%Language:HTML 6.6%Language:CSS 5.3%