视频即代码，Remotion 能做什么、不能做什么

最近看到了一款用代码写视频的工具--remotion, 我把 remotion.dev 翻了一遍，动机很具体，想知道一套模板能不能喂进不同数据、批量出片，还能像代码一样进版本库。

一、两类工具卡在哪

翻它之前我先想了一遍现有的两条路，都没走通。

剪辑软件的手工账

PR/AE 靠手动拖拽，把片段拖上时间轴，一条片子一个工程，改一版要翻回去找图层。5000 条片子就是 5000 个工程、5000 次导出，这些动作在界面里没有捷径。工程文件丢进 Git 也没用，diff 出来是一堆二进制和图层 id。

AI 视频工具的黑盒账

AI 视频工具把门槛压得低，一句话进去，一段视频出来，能调的东西停在模板和参数上。片头要换成公司当季的动效规范，或者按订单库的 SKU 一条条出片，接口和数据结构都对不上。

两类工具卡在同一处，视频的生产过程没被当成代码。批量生成、版本管理、对接业务系统，这三件事在代码里都有成熟答案，在剪辑软件里没有。

视频为什么非得一条一条做？

二、Remotion 是什么，帧是怎么渲染出来的

它给的回答最直接，画面就是 React 组件，时间由帧号决定。

一句话定义

Remotion 是开源、基于 React 的视频框架，官方管它叫 video as code，视频即代码。

渲染链只有三步

写的是 React 组件，组件描述某一帧长什么样。React 把每一帧渲染成 DOM，无头 Chromium 再把它截成图像，FFmpeg 按帧率编码成 MP4。时间轴由帧号推出来，界面里那根播放头到这里只是一个数字。

一帧一帧截，速度能好到哪去？这篇不给数字，我没在本机跑过。

三条入口，首页并排摆着

programmatically 全用代码控制，数据进、视频出，能进 Git 也能进 CI，入口是 API Docs。
interactively 在 Remotion Studio 里拖时间轴、调关键帧，改完存回代码，入口是 Studio。
agentically 让 Agent 读官方文档写组件，人只审代码，入口是 Agent Skills。

首页第三栏那个 agentically，指的就是最后这条，让 Agent 代写组件。

它不替代 PR/AE

影视后期和精细特效剪辑交给 AE 更合适。Remotion 站在自动化和可编程这条赛道上，卖的是批量、可维护、能和业务系统长在一起。

三、能力盘点，它能干哪些活

帧从哪来清楚了，接下来看这些帧能拼成什么。

参数化与设计系统

片头、字幕条、数据卡都能封装成组件，全公司共用一套动效和排版。改一处，下次出的片子全跟着变。官方把这类做法叫 motion design system。

批量渲染

一套模板配一个数据源，1000 条数据进去，1000 条片子出来。剪辑软件做不了这件事，那也不是它擅长的活。

内置素材

元素、动画、转场、音效、字幕、调色六类都自带。官方首页还列了特效预设和转场预设，拼一个短视频够了。

在哪儿出片

渲染入口官方列了六种，差别在于谁在跑那个浏览器。

Studio 手动导出，不写代码的同事也能出片。
CLI 用 npx remotion render，本地和 CI 脚本里最直接。
SSR 在 Node 服务里调渲染 API，按请求出片。
AWS Lambda 一次几百个并发，大批量靠它。
GitHub Actions 提交触发，出片当构建产物。
浏览器端渲染在浏览器里直接出，素材不用上传。

生态配套

Remotion Player 把片子嵌进网页播放。Editor Starter 是付费模板，拿它可以做在线剪辑器。Agent SDK 还没发布，官方标着 Soon。remotion.dev/convert 是本地转码工具，remotion.media 提供测试素材。

官网上挂着几个数字，按 2026 年 11 月 14 日的首页抄下来，72K stars、6M+ 月安装、1200 页文档、12K+ Discord 成员、300+ contributors、800 家客户。这些只说明它不会明天消失。

同一套组件能不能既出横屏又出竖屏？能，宽高写在 composition 的参数里，改一处就换一个比例。

四、场景与人群，谁该用谁别用

这些能力落到具体活上，分岔就清楚了。

什么活儿适合

数据可视化短片、技术演示动画，数据一变，片子重出。
批量个性化视频，年度报告、证书、营销素材按用户生成。
自研视频工具、在线剪辑平台，Player 和 Editor Starter 就是为这个准备的。
视频模板要能维护、能回滚、要对接后端自动出片。

它接不住的活儿

复杂影视后期、精细特效剪辑，AE 更合适。
只想拖拽剪长视频、不打算碰 JS 和 React，剪辑软件省事得多。

批量出片适合它，长片后期不适合，这条线分得挺清楚。两条路的差别在数量，一边是很多条、各自不同、还要能重出，一边是一条、要调得很细。

五、极简上手，五分钟跑起来

活儿对得上，才谈怎么把它跑起来。

前置依赖

Node 16 以上就能跑，具体版本看官方 system requirements。装机页里有条容易漏的，Linux 的 glibc 要 2.35 以上，macOS 要 15 以后，Alpine 和 nixOS 官方不支持。

两条命令

bash 复制代码

npx create-video@latest

选模板、装依赖，接着启动 Studio。

bash 复制代码

npm run dev

改代码，画面实时刷新

Studio 里时间轴和关键帧都能拖，保存即生效。一条视频怎么组织，看这段 composition 就明白。

tsx 复制代码

import { Composition } from "remotion";
import { MyVideo } from "./MyVideo";

export const Root = () => (
  <Composition id="MyVideo" component={MyVideo} durationInFrames={150} fps={30} width={1080} height={1920} />
);

六、许可与商用

能跑起来之后，才轮到钱。这一节我核了两遍，因为它最容易记错。

免费范围

Remotion 用自家的 Remotion License，MIT 这类通用开源许可在这里不适用。个人用免费，3 人以内的公司也免费，商用不额外收费。

七、优势、局限，和后面几篇

费用算完，最后把它的好坏各摆一边。

值得用的地方

我更看重两处，一是复用前端技术栈，React、CSS、SVG、Canvas、WebGL 都能直接进画面，动效不用另学一套；二是视频即代码，片子和网页一样进 Git，改一版能 diff，回滚不用重做。

数据驱动批量渲染，模板加数据源，出片量跟着数据量走。
能嵌进业务系统，Player 放网页里，渲染 API 挂后端，出片就是一次接口调用。

会卡住的地方

要 React 底子，不会组件和 hooks，学习成本不比学剪辑低。
渲染吃资源，本地渲一版就占满 CPU，量大要上云，云上按量计费。
长视频慢，几十分钟的成片按小时算，短视频和动态图文才是它待着舒服的地方。

参考文档

GitHub 仓库 github.com/remotion-de... ，源码和示例都在里面。
官方文档 www.remotion.dev/docs ，API 和渲染入口从这里查。