High performance video editing for the mobile web
summary
At Threads a mobile web video editor is built in weeks that combines canvas rendering with an invisible React UI and an ffmpeg backend to produce near pixel‑perfect previews you can edit in real time and highly optimized MP4 output. It avoids downloading ~30 JPEGs/second by rendering video to canvas and uses the double‑height alpha trick for transparent animated stickers plus ffmpeg filter_complex pipelines, a canvas pool and filter‑reuse cache to keep memory and CPU usable on iPhone 8 Plus class devices.
AI-written summary · about
chapters (14)
- 0:00Intro
- 0:18Requirements
- 2:27Problems
- 4:34BBC Video Context
- 5:09Other Options
- 7:54Proof of concept
- 15:01Filter Complex
- 18:31Define an Asset
- 19:29Define a Filter
- 20:10In The Browser
- 24:36Solution
- 36:13@authentication
- 38:19Future Plans
- 41:27Follow Me
related talks
12mExploring Video Editing in the Browser
24mVideo Editing in the Browser
25mBetting on the web: Ensuring fine-tuned performance for dynamic web apps
20mBuilding a Professional Video Editor on the Cloud, Powered by Machine Learning
35mBuilding a Video Editor for iOS
28m60 FPS or Bust: Bleeding Edge Web Animation
30mOther browser APIs that are going to change video on the web
26mOptimizing Video Performance for Web Developers