Skip to main content

stitchFramesToVideo()

Part of the @remotion/renderer package.

Takes a series of images and audio information generated by renderFrames() and encodes it to a video.

info

In Remotion 3.0, we added the renderMedia() API which combines renderFrames() and stitchFramesToVideo() into one simplified step and performs the render faster. Prefer renderMedia() if you can.

Arguments​

An object with the following properties:

dir​

A string containing the absolute path of the directory where the frames are located. This will be the directory where the ffmepg command will be executed.

fps​

A number specifying the desired frame rate of the output video.

width​

A number specifying the desired output width in pixels for the video.

height​

A number specifying the desired output height in pixels for the video.

outputLocation​

optional since v3.0.26

An absolute path specify where the output file should be written to.

If not specified or set to null, the file will be returned in-memory as a buffer.

force​

Whether in case of an existing file in outputLocation it should be overwritten. Type boolean.

assetsInfo​

Information about the audio mix. This is part of the return value of renderFrames().

pixelFormat?​

optional

Sets the pixel format. See here for available values. The default is yuv420p.

codec?​

optional

Set a codec. See the encoding guide for available values and guidance on which one to choose. The default is h264.

crf?​

optional

The constant rate factor of the output, a parameter which controls quality. See here for more information about this parameter. Default is depending on the codec.

proResProfile?​

optional

Sets a ProRes profile. Only applies to videos rendered with prores codec. See Encoding guide for possible options.

onProgress?​

optional

Callback function which informs about the encoding progress. The frameNumber value is a number.

ts
const onProgress = (frameNumber: number) => {
  console.log(`Encoding progress: on ${frameNumber} frame`);
};
ts
const onProgress = (frameNumber: number) => {
  console.log(`Encoding progress: on ${frameNumber} frame`);
};

onDownload?​

optional

Notifies when a remote asset needs to be downloaded in order to extract the audio track.

ts
const onDownload = (src: string) => {
  console.log(`Downloading ${src}...`);
};
ts
const onDownload = (src: string) => {
  console.log(`Downloading ${src}...`);
};

numberOfGifLoops?​

optional, available since v3.1

Set the looping behavior. This option may only be set when rendering GIFs. See here for more details.

muted​

optional, available since v3.2.1

Disables audio output. This option may only be set in combination with a video codec and should also be passed to renderFrames().

verbose​

optional

A boolean value that when set to true, will log all kinds of debug information. Default false.

ffmpegExecutable​

optional

A custom FFMPEG executable to be used. By default, a binary called ffmpeg will be searched in your PATH.

ffprobeExecutable?​

optional, available from v3.0.17

An absolute path overriding the ffprobe executable to use.

cancelSignal?​

optional, available from v3.0.15

A token that allows the render to be cancelled. See: makeCancelSignal()

Return value​

stitchFramesToVideo() returns a promise which resolves to nothing. If everything goes well, the output will be placed in outputLocation.

See also​