Show HN: VidStudio, a browser based video editor that doesn't upload your files (vidstudio.app)
Some of the features: multi-track timeline, frame accurate seek, MP4 export, audio, video, image, and text tracks, and a WebGL backed canvas where available. It also works on mobile.
Under the hood, WebCodecs handles frame decode for timeline playback and scrubbing, which is what makes seeking responsive since decode runs on the hardware decoder when the browser supports it. FFmpeg compiled to WebAssembly handles final encode, format conversion, and anything WebCodecs does not cover. Rendering goes through Pixi.js on a WebGL canvas, with a software fallback when WebGL is not available. Projects live in IndexedDB and the heavy work runs in Web Workers so the UI stays responsive during exports.
Happy to answer technical questions about the tradeoffs involved in keeping the whole pipeline client-side. Any feedback welcome.
49 comments
[ 3.3 ms ] story [ 64.0 ms ] threadFFmpeg's license is the LGPL 2.1. VidStudio looks like closed source software, I couldn't see any indication that it's free software. You're distributing this software to run in the client's browser. I'm not a lawyer but I think you're in breach of the terms of the LGPL.
https://www.ffmpeg.org/legal.html
I'm interested in how you handle demuxing different container formats any which ones are supported?
I get "Audio decode failed: your browser cannot decode the audio in "41b1aee9-ac65-43f6-b020-e8fed77c3c72_webm.bin". Try re-encoding the file with AAC audio." for a WEBM with no audio.
h264/aac MP4 works, is that demuxed with mp4box.js? I noticed seeking (clicking or scrubbing on timeline) initializes a new VideoDecoder and destroys the previous one for every new frame, leading to abysmal performance as you lose decoder state and a lot of decoding work has to be repeated. Plus the decoder reinitialization time. Is that because the demuxing logic doesn't give precise access to encoded frames? iirc mp4box.js didn't support that last time I checked.
ffmpeg supports decoding 10-bit video.
And all the text in the app is selectable and copypastable.
Does anyone know if there is any limitation to create a "https-local://" or something like that, which guarantee that things are only downloaded, and never uploaded?
Even if it's not business. Sister shares video she edited of party. Mom points something out, sister makes edit.
I'm not saying there's no use to local only solutions. I'm only saying that I suspect for most users, the benefits of in the cloud are something they want.
Wondering if it support subtitle and transcript? It would be helpful for non-native speaker use case.
Also, can you talk more about the use case difference between VidStudio vs. Finalcut/Imovie/Premiere? I am quite interested. Thanks
It sounds like a similar stack, but distributed as an app. FFmpeg (LGPL compilation).
I haven't tried Pixi.js, looks interesting. I guess it was good for this.
Have you looked at remotion? I found them good for somethings, but ended up using Safari for rendering (instead of remotion's chrome-based rendering) because app packaging was easier that way.
https://www.loremlabs.com/cliproom if you're interested in comparing
I went down the same path for videotobe.com, fully client-side with ffmpeg.wasm, and it fell over on longer videos. The memory ceiling and encode times pushed me to a cloud processing pipeline.
You've managed to solve both, the WebCodecs plus Pixi plus ffmpeg.wasm split looks like the right decomposition in hindsight.I processed 3+ hrs of media using VidStudio and it held up. Nicely done!
"Your browser does not support the codec "hvc1.2.4.L156". Try a different video."
Ok, fair, probably need to use Chrome for this type of tool. Tried it in Chrome:
"Audio decode failed: your browser cannot decode the audio in "..._webm.bin". Try re-encoding the file with AAC audio."
Sad. Hope you manage to work this out. Let me know if you have a newsletter or something where I can get notified if this gets fixed.
I've been using server-based (online, upload required) tools for this sort of stuff, but am now going to be using this.
Pretty cool find considering I have no need for a full-fledged video editor right now, and was just checking this out for fun.
A "your browser can't decode this codec, try Chrome" nudge would probably spare people the bounce, especially on test imports from their phone.