13 Free Web-based Video Editor Apps and JavaScript Frameworks

13 Free Web-based Video Editor Apps and JavaScript Frameworks
Photo by Wahid Khene / Unsplash

Building a video editing web app can be challenging. In this post, we provide a collection of the best open-source JavaScript frameworks and video editing apps.

1. Etro

Etro is a typescript framework for programmatically editing videos. It lets you composite layers and add filters (effects).

Etro comes shipped with text, video, audio and image layers, along with a bunch of GLSL effects. You can also define your own layers and effects with javascript and GLSL.

Features

  • Composite video and audio layers
  • Use built-in hardware accelerated effects
  • Write your own effects in JavaScript and GLSL
  • Manipulate audio with the web audio API (audio effects coming soon)
  • Define layer and effect parameters as keyframes or custom functions
  • Render to a blob in realtime (offline rendering coming soon)
GitHub - etro-js/etro: Typescript video-editing framework for the browser
Typescript video-editing framework for the browser - etro-js/etro

2. Editly

Editly is a tool and framework for declarative NLE (non-linear video editing) using Node.js and ffmpeg. Editly allows you to easily and programmatically create a video from a set of clips, images, audio and titles, with smooth transitions and music overlaid.

Editly has a simple CLI for quickly assembling a video from a set of clips or images, or you can use its more flexible JavaScript API.

Inspired by ffmpeg-concat, editly is much faster and doesn't require much storage because it uses streaming editing. Editly aims to be very extensible and feature rich with a pluggable interface for adding new dynamic content.

GitHub - mifi/editly: Slick, declarative command line video editing & API
Slick, declarative command line video editing & API - mifi/editly

3. Reactive

Reactive is a react based video editor made with the mission to build the simplest yet powerful video editing software. It supports drag and drop for videos and images, also it is easy to install and use.

GitHub - Prakshal-Jain/Reactive: Reactive is a react based in-browser video editor made with the mission to build the simplest yet powerful video editing software. #portfolio
Reactive is a react based in-browser video editor made with the mission to build the simplest yet powerful video editing software. #portfolio - Prakshal-Jain/Reactive

4. Video Cut Tool

Wikimedia Tool to Trim Online Videos in Wikimedia Commons.

GitHub - gopavasanth/video-cut-tool: Wikimedia Tool to Trim Online Videos in Wikimedia Commons. https://commons.wikimedia.org/wiki/Commons:VideoCutTool
Wikimedia Tool to Trim Online Videos in Wikimedia Commons. https://commons.wikimedia.org/wiki/Commons:VideoCutTool - gopavasanth/video-cut-tool

5. Lossless Cut

LosslessCut is a cross-platform FFmpeg GUI designed for rapid, lossless operations on video, audio, subtitle, and other media files. It allows for lossless trimming and cutting of files, ideal for rough-cutting large video files from various sources.

It enables quick extraction of desired video parts, discarding unnecessary data without losing quality through slow re-encoding. Additional features include adding music or subtitle tracks to videos without encoding. Its speed is due to its near-direct data copy approach, powered by FFmpeg.

The app is written using JavaScript, and TypeScript but it runs as a desktop app for Linux, Windows and macOS.

Easily Cut and Edit your Videos with LosslessCut for Windows, Linux and macOS
What is LosslessCut? LosslessCut stands as an unrivaled, cross-platform FFmpeg GUI, engineered for speedy, lossless operations on video, audio, subtitle, and other media files. It excels in offering lossless trimming and cutting of files, emerging as the ultimate tool for rough-cutting large video files without any compromise on quality or
GitHub - mifi/lossless-cut: The swiss army knife of lossless video/audio editing
The swiss army knife of lossless video/audio editing - mifi/lossless-cut

6. Video Editor (Node.js)

This is an open-source web-based Video Editor Using MLT Framework.

Features

  • web application no plugin required
  • server side rendering
  • supported modern browsers (Firefox, Chrome, Safari, ...)
  • open-source, Apache-2.0 license
  • project automatically saved on server (as MLT XML), accessible via link
  • unlimited number of video and audio tracks
  • 6 video and audio filters (with ability to create more filters)

Input

  • Supported formats depends on mlt framework, respectively on supported formats by ffmpeg.
  • Video duration tested up to 1 hour 30 minutes.
  • Input resolution up to 4K.

Outputs

Currently set to:

  • Container: mp4
  • Audio codec: aac
  • Video codec: libx264
GitHub - kudlav/videoeditor: Web Based Video Editor Using MLT Framework, Bachelor thesis
Web Based Video Editor Using MLT Framework, Bachelor thesis - kudlav/videoeditor

7. FFCreator

FFCreator is a lightweight, flexible short video processing library based on Node.js. It allows for the quick creation of exciting video albums from pictures, music, or video clips. It's a solution for creating short videos on the web or dynamically generating them from picture and text content. It requires few dependencies, low machine configuration, and simulates 90% of animate.css animation effects, enabling easy conversion of web page animations into videos.

Features

  • Based on node.js development, it is very simple to use and easy to expand and develop.
  • Very few dependencies, easy to install, cross platform, just a common configuration linux server.
  • The video processing speed is very fast, a 5 minute video only needs 1-2 minutes.
  • Nearly a hundred kinds of scene transition animation effects.
  • Support picture, sound, video clips, text and other elements.
  • Contains most animation effects of animate.css, css animation is converted to video.
  • Support subtitle components, can combine subtitles to speech to produce audio news.
  • Support chart components, you can make data visualization videos.
  • Support simple (expandable) VTuber, you can add YouTuber based on sequence frames.
GitHub - tnfe/FFCreator: 一个基于node.js的高速视频制作库 A fast video processing library based on node.js
一个基于node.js的高速视频制作库 A fast video processing library based on node.js - tnfe/FFCreator

8. mebm

mebm is a browser based video editor that supports animation of images and text overlays. The animation is done with key-frames (denoted in blue on the timeline) and linear interpolation.

The design values simplicity and rudimentary functionality over a full feature set.

GitHub - bwasti/mebm: zero-dependency browser-based video editor
zero-dependency browser-based video editor. Contribute to bwasti/mebm development by creating an account on GitHub.

9. Video Editor Online

The web-based video editor, created with VueJS frontend and Python, Flask backend with MoviePy, is planning new features. These include uploading multiple video, audio, and image files, basic video operations like trim, join, rotate, simple transitions, and exporting to multiple formats.

GitHub - kernelshreyak/videoeditor_online: A web based Video Editor that runs in the browser. Written in Python(Flask,MoviePy) and JavaScript(VueJS)
A web based Video Editor that runs in the browser. Written in Python(Flask,MoviePy) and JavaScript(VueJS) - kernelshreyak/videoeditor_online

10. Video-Editor

Online Video Editor that is purely Client Side. You can add animations and apply audio and video filters.

Features

  • Read, Write, and Edit MP4 files
  • Delete Specific Part From Video
  • Purely Client-Side Editing (No Server Uploads)
  • Cut Specific Part From Video
  • Add Graphics (e.g., images, SVG, shapes) to Video
  • Add Animation to Video
  • Apply Filters to Video
  • Apply Audio Effects
GitHub - khuramhaf/Video-Editor: Online Video Editor that is purely Client Side. You can add animations and apply audio and video filters
Online Video Editor that is purely Client Side. You can add animations and apply audio and video filters - khuramhaf/Video-Editor

11. Fast Cut

Fast Cut is a tool that allows users to visually cut and join videos then export them losslessly.

It is primarily used to join camcorder footages and remove commercial breaks from recordings. Fast Cut provides a GUI for FFmpeg and supports both Linux and Windows OSes, but not Mac OS.

It mainly supports the conversion from MPEG Transport Stream to MPEG-4 Part 14, but any FFmpeg supported format could be used.

Features

  • frame preview, no audio
  • preview timeline with cut parts
  • binary search to find a cut point
  • lossless export when supported by codecs and format
  • could run on a remote server such as a NAS
  • small, under 1Mb without FFmpeg
  • plain lua, html and javascript, no compiler
GitHub - javalikescript/fcut: Fast cut and join videos
Fast cut and join videos. Contribute to javalikescript/fcut development by creating an account on GitHub.

12. Online-Video-Editor

The online MP4 video editor allows for editing videos without server uploads, using Web Coded API and Web Audio API for audio and video decoding. It offers trimming, cutting, and audio extraction features, and uses the JavaScript Recorder for video recoding and conversion to .webm files.

Features

  • Trim and cut videos
  • Extract audio from videos
  • Convert videos to .webm format
  • No downloads or installations required
  • Works on all major browsers
GitHub - khuramhaf/Online-Video-Editor: Edit MP4 videos online without uploading files to a server. Our browser-based video editor makes it easy to trim, cut and more. No downloads or installations required.
Edit MP4 videos online without uploading files to a server. Our browser-based video editor makes it easy to trim, cut and more. No downloads or installations required. - khuramhaf/Online-Video-Editor

13. Web Video Editor

The Web Video Editor allows file upload and frame reading, dynamic cache loading frame on the timeline, and video editing using WebAssembly and FFmpeg. It uses a Vue3 + JavaScript tech stack and a self-developed timeline framework.

GitHub - SartreShao/video-editor.webassembly: Pure Front-end Video Editor
Pure Front-end Video Editor. Contribute to SartreShao/video-editor.webassembly development by creating an account on GitHub.