unknown

Story Splitter is a privacy-focused Progressive Web App that splits videos entirely in the browser using FFmpeg.wasm. Built with React and TypeScript, it processes videos client-side with zero quality loss through stream copying, works completely offline after first visit, and requires no uploads or data collection. The app features drag-and-drop upload, real-time preview, automatic segment calculation with manual adjustment, and supports all FFmpeg-compatible formats. Key technical implementations include service worker caching, SharedArrayBuffer for multi-threaded processing, and proper COOP/COEP headers for browser compatibility.

Story Splitter

sayed mahmoud

I built a Progressive Web App that splits videos entirely in your browser using FFmpeg.wasm—no uploads, no servers, zero quality loss. The app uses FFmpeg's stream copy mode (-c copy) to split videos without re-encoding, preserving original quality while being up to 100x faster than transcoding. It's built with React 18, TypeScript, and Vite, and works 100% offline as a PWA after the first visit. Your videos never leave your device, there's no tracking, and it's completely open source.


Built in under 2 hours using AI-assisted development (Windsurf + Claude Sonnet 4.5), demonstrating how modern tooling enables rapid prototyping of complex WebAssembly applications. The entire project is privacy-first by design—no data collection, no analytics, just pure client-side processing.


Live Demo: https://story-splitter.netlify.app/
GitHub: https://github.com/sayedmahmoud266/story-splitter
Full Article: https://sayedmahmoud266.website/projects/story-splitter/

<p>I built a Progressive Web App that splits videos entirely in your browser using FFmpeg.wasm—no uploads, no servers, zero quality loss. The app uses FFmpeg's stream copy mode (-c copy) to split videos without re-encoding, preserving original quality while being up to 100x faster than transcoding. It's built with React 18, TypeScript, and Vite, and works 100% offline as a PWA after the first visit. Your videos never leave your device, there's no tracking, and it's completely open source.


Built in under 2 hours using AI-assisted development (Windsurf + Claude Sonnet 4.5), demonstrating how modern tooling enables rapid prototyping of complex WebAssembly applications. The entire project is privacy-first by design—no data collection, no analytics, just pure client-side processing.


Live Demo: https://story-splitter.netlify.app/
GitHub: https://github.com/sayedmahmoud266/story-splitter
Full Article: https://sayedmahmoud266.website/projects/story-splitter/</p>