Skip to main content

质量指南

视频编码涉及大量压缩视频数据以减小文件大小,这是一个有损过程。
本文档解释了一些可以用来控制视频质量的因素和设置。

CRF

控制视频质量的主要设置是恒定码率因子(CRF)
在 Remotion 中渲染视频的所有方式都允许传递一个 CRF 值。允许的值取决于编解码器。

分辨率(文本不清晰)

一个令人惊讶的失去质量的方式是许多计算机具有高密度显示,但视频的尺寸并未考虑到这一点。

考虑一个 1920x1080 的视频,在其中渲染文本:

tsx
import { Composition } from "remotion";
 
const MyComponent = () => {
return <div>Hello World</div>;
};
 
const Root: React.FC = () => {
return (
<Composition
width={1920}
height={1080}
fps={30}
durationInFrames={100}
component={MyComponent}
id="MyComp"
/>
);
};
tsx
import { Composition } from "remotion";
 
const MyComponent = () => {
return <div>Hello World</div>;
};
 
const Root: React.FC = () => {
return (
<Composition
width={1920}
height={1080}
fps={30}
durationInFrames={100}
component={MyComponent}
id="MyComp"
/>
);
};

如果将其渲染并嵌入到网页中的视频:

html
<video src="video.mp4" width="1920" height="1080"></video>
html
<video src="video.mp4" width="1920" height="1080"></video>

如果在高密度显示器上显示视频(如 MacBook),文本将不够清晰。
这是因为设备具有 2x 像素密度,但视频是 1920x1080,这意味着每个像素比设备的像素大 2 倍。
要以与低密度显示器上相同的清晰度显示字体,您需要渲染一个 4K 视频。

使用输出缩放以更高的像素密度渲染视频。

JPEG 质量

Remotion 默认以 JPEG 格式对浏览器页面进行截图。
JPEG 质量默认为 80(在 0 到 100 的范围内)。
您可以使用 --jpeg-quality 标志进行调整,或者使用 --image-format=png 切换到 PNG 作为图像格式(速度较慢)。

色彩准确性

将您的视频导出为 bt709 以获得更准确的颜色。

note

这将成为 Remotion 5.0 的默认设置。

GIF 颜色

确保您至少使用 Remotion 版本 v4.0.138 以获得最佳的颜色准确性。
GIF 只支持 256 种颜色调色板,这会导致严重的质量损失。接受它,或者如果不可接受,请选择其他格式。

视频比特率

您可以使用 --video-bitrate 标志来控制视频的比特率。
它与 --crf 选项是互斥的,这意味着您不能同时使用两者。

x264 预设

在导出 H.264 视频时,您可以使用 --x264-preset 标志来控制质量/速度/压缩的权衡。