Files
augani--openreel-video/README.md
T
wehub-resource-sync bb260450d4
CI / Test & Lint (push) Has been cancelled
CI / Build (push) Has been cancelled
docs: make Chinese README the default
2026-07-13 10:20:07 +00:00

9.9 KiB
Raw Blame History

Note

本文档由 WeHub 基于上游 README 翻译整理,属于社区翻译,非官方中文文档。
English · 原始项目 · 上游 README
原作者、版权与许可证归属以原始项目及本仓库 LICENSE 文件为准。

OpenReel Video

开源 CapCut 替代方案。在浏览器中进行专业视频编辑。无需上传。无需安装。100% 开源。

OpenReel Video 是一款功能齐全的基于浏览器的视频编辑器,完全在客户端运行。基于 React、TypeScript、WebCodecs 和 WebGPU 构建,提供专业级视频编辑能力,无需昂贵软件或云端处理。

在线试用 | 文档 | 讨论 | Twitter

OpenReel Editor License Status Open Source


为什么选择 OpenReel

  • 100% 客户端 - 你的视频永远不会离开你的设备。无需上传,无需云端处理,完全隐私。
  • 无需安装 - 在 Chrome/Edge 中即可使用。打开即可开始编辑。
  • 专业功能 - 多轨道时间线、关键帧动画、调色、音频效果等。
  • GPU 加速 - WebGPU 和 WebCodecs 实现流畅的 4K 编辑与快速导出。
  • 永久免费 - MIT 许可,无订阅,无水印。

功能

视频编辑

  • 多轨道时间线 - 无限视频、音频、图像、文本和图形轨道
  • 实时预览 - GPU 加速的流畅播放
  • 精确编辑 - 逐帧精确拖动、剪切、修剪、分割、波纹删除
  • 转场 - 交叉淡化、淡入黑/白、擦除、滑动效果
  • 视频效果 - 亮度、对比度、饱和度、模糊、锐化、发光、暗角、色度键(chroma key)
  • 混合模式 - 正片叠底(Multiply)、滤色(Screen)、叠加(Overlay)、相加(Add)、相减(Subtract)等
  • 速度控制 - 0.25x 至 4x,保留音频音调
  • 裁剪与变换 - 位置、缩放、旋转,支持 3D 透视

图形与文本

  • 专业文本编辑器 - 丰富样式、阴影、描边、渐变
  • 20+ 文本动画 - 打字机、淡入淡出、滑动、弹跳、弹出、弹性、故障(glitch)
  • 卡拉 OK 风格字幕 - 逐词高亮,与音频同步
  • 形状工具 - 矩形、圆形、箭头、多边形、星形,支持填充/描边
  • SVG 支持 - 导入 SVG,支持着色与动画
  • 贴纸与表情 - 内置素材库
  • 背景生成器 - 纯色、渐变、网格渐变、图案
  • 关键帧动画 - 随时间动画任意属性,20+ 缓动曲线

音频

  • 多轨道混音 - 无限音频轨道,实时混音
  • 波形可视化 - 可视化音频编辑
  • 音频效果 - EQ、压缩器、混响、延迟、合唱、镶边、失真
  • 音量与声像 - 逐片段控制,支持淡入/淡出
  • 节拍检测 - 自动生成与音乐同步的标记
  • 音频闪避(ducking - 对话播放时自动降低背景音乐音量
  • 降噪 - 三阶段降噪(音调、宽带、低频隆隆声)

调色

  • 色轮 - Lift、Gamma、Gain 控制
  • HSL 调整 - 色相、饱和度、亮度精细调节
  • 曲线编辑器 - RGB 及各通道曲线
  • LUT 支持 - 导入并应用 3D LUT
  • 内置预设 - 一键调色

导出

  • MP4 (H.264/H.265) - 通用兼容格式
  • WebM (VP8/VP9/AV1) - Web 优化格式
  • ProRes - 专业中间格式(Proxy、LT、Standard、HQ、4444
  • 质量预设 - 4K @ 60fps、1080p、720p、480p
  • 自定义设置 - 比特率、帧率、编解码器选项、色深
  • 硬件编码 - WebCodecs 实现快速导出
  • AI 超分辨率 - 使用 WebGPU 着色器提升分辨率
  • 音频导出 - MP3、WAV、AAC、FLAC、OGG
  • 图像序列 - JPG、PNG、WebP 逐帧导出
  • 进度跟踪 - 实时进度,支持取消

专业工具

  • 无限撤销/重做 - 完整历史记录与恢复
  • 自动保存 - 永不丢失工作(IndexedDB 存储)
  • 键盘快捷键 - 专业工作流
  • 吸附网格 - 磁性对齐
  • 轨道管理 - 显示/隐藏、锁定/解锁、重新排序
  • 字幕支持 - 导入 SRT,可自定义样式
  • 屏幕录制 - 录制屏幕、摄像头或两者
  • 项目共享 - 导出/导入项目文件

性能

  • WebGPU 渲染 - GPU 加速合成
  • WebCodecs API - 硬件视频解码/编码
  • 帧缓存 - LRU 缓存实现流畅播放
  • Web Workers - 后台处理
  • 4K 支持 - 以 4K 分辨率编辑与导出

快速开始

在线试用

访问 openreel.video 即可立即开始编辑。

本地运行

# Clone the repository
git clone https://github.com/Augani/openreel-video.git
cd openreel-video

# Install dependencies (requires Node.js 18+)
pnpm install

# Start development server
pnpm dev

# Open http://localhost:5173

生产构建

pnpm build
pnpm preview

浏览器要求

Browser Version Status
Chrome 94+ Full support
Edge 94+ Full support
Firefox 130+ Full support
Safari 16.4+ Full support

所有主流浏览器现已支持 WebCodecs,可实现硬件加速的视频编码/解码。

推荐配置:

  • 8GB+ RAM
  • 独立 GPU(用于 4K 编辑)
  • 现代多核 CPU

架构

Monorepo 结构

openreel/
├── apps/web/              # React frontend (~66k lines)
│   └── src/
│       ├── components/    # UI components
│       │   └── editor/    # Editor panels (Timeline, Preview, Inspector)
│       ├── stores/        # Zustand state management
│       ├── services/      # Auto-save, shortcuts, screen recording
│       └── bridges/       # Engine coordination
│
└── packages/core/         # Core engines (~59k lines)
    └── src/
        ├── video/         # Video processing, WebGPU rendering
        ├── audio/         # Web Audio API, effects, beat detection
        ├── graphics/      # Canvas/THREE.js, shapes, SVG
        ├── text/          # Text rendering, animations
        ├── export/        # MP4/WebM encoding
        └── storage/       # IndexedDB, serialization

核心技术

  • React 18 + TypeScript - 类型安全的 UI
  • Zustand - 轻量级状态管理
  • MediaBunny - 视频/音频处理
  • WebCodecs - 硬件编码/解码
  • WebGPU - GPU 加速渲染
  • Web Audio API - 专业音频处理
  • THREE.js - 3D 变换与效果
  • IndexedDB - 本地项目存储

设计原则

  • 基于操作的编辑 - 每次编辑都是可撤销的操作
  • 不可变状态 - 通过 Zustand 实现可预测的更新
  • 引擎分离 - 视频、音频、图形引擎相互独立
  • 渐进增强 - 优雅降级(WebGPU → Canvas2D

AI 辅助开发

OpenReel 是 AI 辅助开源开发的一次实验。Claude AI 协助管理:

  • Issue 分类 - 审查并回复 issue
  • 代码实现 - 编写功能并修复 bug
  • 代码审查 - 维持质量标准
  • 文档 - 保持文档最新

Augustus 的人工监督确保战略方向,并对重大变更进行最终审批。所有代码公开、经过测试,并遵循最佳实践。

对贡献者而言这意味着:

  • Issue 会快速得到审查(通常在 24 小时内)
  • Bug 修复快速发布
  • 对问题给出清晰、详细的回复
  • 高代码质量标准

贡献

欢迎贡献!请参阅 CONTRIBUTING.md 了解指南。

贡献方式:

  • 报告 bug 并提供复现步骤
  • 在 Discussions 中建议功能
  • 提交 bug 或功能的 PR
  • 改进文档
  • 编写测试
  • 分享效果预设

开发工作流:

# Fork and clone
git clone https://github.com/Augani/openreel-video.git

# Create feature branch
git checkout -b feat/your-feature

# Make changes, then test
pnpm typecheck
pnpm test
pnpm lint

# Commit with conventional commits
git commit -m "feat: add your feature"

# Push and open PR
git push origin feat/your-feature

路线图

已完成

  • 多轨道时间线,支持拖放
  • 实时视频预览,支持 GPU 加速
  • 完整编辑套件(剪切、修剪、分割、转场)
  • 文本编辑器,含 20+ 种动画
  • 图形(形状、SVG、贴纸、背景)
  • 音频混音,含特效与节拍检测
  • 调色,支持 LUT
  • 关键帧动画系统
  • 导出为 MP4/WebM(支持 4K
  • 屏幕录制
  • AI 超分辨率放大
  • 撤销/重做,带自动保存

进行中

  • 嵌套序列(时间线中的时间线)
  • 运动跟踪
  • 更多导出格式(ProRes、GIF
  • 插件系统

计划中

  • 调整图层
  • 高级蒙版
  • 音频频谱编辑
  • 协作编辑
  • 移动端优化

许可证

MIT License - 可免费用于个人和商业项目。

详情请参阅 LICENSE


致谢

构建技术栈:

灵感来源:

  • DaVinci Resolve - 专业工具的正确做法
  • CapCut - 人人可用的剪辑体验
  • Figma - 基于浏览器的专业软件

支持

  • GitHub Issues - 错误报告与功能请求
  • GitHub Discussions - 问答与社区交流
  • Twitter/X - @python_xi

$OPENREEL Token

CA: B7wDnfrdtvdG7SCkRjSMJ6LkVwGWvdWrQ75iV8G9pump


@python_xi 与 AI 协作精心打造。

让专业视频剪辑人人可用。永久免费。永久开源。