Liên kết

Trình chỉnh sửa video đa track chạy trên trình duyệt

19 tháng 3, 2026 · github

TL;DR

Công cụ edit video chạy 100% trên trình duyệt Chrome — không cần cài đặt, không upload lên server, mọi thứ xử lý local trong máy bạn.

Nói đơn giản: Kéo thả video vào là dựng được, xuất file luôn mà không cần phần mềm nặng.

Bài này dành cho ai?

1. Người muốn edit video nhanh không cần cài đặt

Vấn đề: Cài Premiere, Davinci nặng máy, muốn cái nhẹ hơn để làm nhanh Khi nào cần: Cắt ghép video ngắn, thêm text, effect đơn giản Được gì: Edit được ngay trên Chrome, không tốn dung lượng máy

2. Người muốn build sản phẩm liên quan đến video

Vấn đề: Cần reference về cách xây dựng video editor bằng WebCodecs Khi nào cần: Học cách handle video trong trình duyệt, xử lý timeline, render Được gì: Source code mẫu với React 19, cấu trúc rõ ràng theo feature

3. Người muốn tự động hóa workflow video

Vấn đề: Cần giải pháp edit video chạy serverless Khi nào cần: Build tool cho team cần edit nhanh mà không phụ thuộc phần mềm cài sẵn Được gì: Tích hợp được vào pipeline tự động

Các điểm chính

Edit video local, không cần upload Dùng WebCodecs, OPFS, File System Access API để xử lý video ngay trong trình duyệt. File được reference, không copy, tiết kiệm bộ nhớ. Hỗ trợ file lớn đến 5GB. → Làm gì: Vào freecut.net, kéo video vào thử xem có chạy mượt không.
Timeline đa track đầy đủ Multi-track cho video, audio, text, image, shape. Có track groups với mute/visible/locked propagation. Công cụ trim, split, join, ripple delete, rate stretch. Pre-compositions (nested compositions 1 level). → Làm gì: Tạo project mới, import vài clip, thử kéo vào timeline xem flow.
Effects và animation có sẵn CSS filter effects (brightness, contrast, saturation, blur…). Glitch effects (RGB split, scanlines, color glitch). Canvas effects (halftone). Overlay (vignette). Presets: vintage, noir, cold, warm, dramatic, faded. Keyframe animation với Bezier curve editor và nhiều easing function. → Làm gì: Thử thêm effect và transition vào clip xem có đẹp không.
Export trực tiếp từ trình duyệt Render bằng WebCodecs, không cần server. Video: MP4, MOV, WebM, MKV. Audio-only: MP3, AAC, WAV. Codecs: H.264, H.265, VP8, VP9, ProRes. Quality presets: low, medium, high, ultra. → Làm gì: Export thử 1 video ngắn xem chất lượng ra sao.
Tech stack hiện đại React 19 + TypeScript, Vite build nhanh. State management bằng Zustand + Zundo cho undo/redo. UI theo Tailwind CSS 4 + shadcn/ui. Dùng WebCodecs, OPFS, IndexedDB để lưu trữ local. → Làm gì: Clone về chạy npm run dev xem cấu trúc code.
Yêu cầu Chrome 102+ Phụ thuộc WebCodecs, OPFS, File System Access API - chưa hỗ trợ đầy đủ trên Firefox/Safari. Brave thì phải bật tay File System Access API trong brave://flags. → Làm gì: Dùng Chrome để test, hoặc bật flag tương ứng nếu dùng Brave.

Quick Start

Trải nghiệm ngay: Vào freecut.net trên Chrome, tạo project, kéo video vào timeline, thử cắt ghép và export
Nếu muốn tự host: git clone, npm install, npm run dev — chạy local trên port 5173