Skip to main content

renderVideo()

The renderVideo function lets you render (parameterized) videos in a nodejs process. It uses a headless browser to achieve this.

Example Usage​

import {renderVideo} from '@revideo/renderer';

function logProgressToConsole(id: number, progress: number) {
  console.log(`[${id}] Progress: ${(progress * 100).toFixed(1)}%`);
}

renderVideo({
  projectFile: './src/project.ts',
  variables: {color: 'white'},
  settings: {
    outFile: 'video.mp4',
    workers: 1,
    range: [1, 3],
    dimensions: [1080, 1792],
    logProgress: true,
    ffmpeg: {
      ffmpegLogLevel: 'error',
      ffmpegPath: 'ffmpeg',
    },
    puppeteer: {
      args: ['--no-sandbox'],
    }
    progressCallback: logProgressToConsole
  }
});

Arguments​

The input arguments are a RenderVideoProps object, which has the following properties:

projectFile​

string

Points towards your project file. This will probably be ./src/project.ts.

variables?​

Record<string, any>

Parameters / or variables passed to your video. See here learn more about parameterized videos.

settings?​

A RenderSettings object with the following properties:

outFile?​

string, has to end with '.mp4'

The file name of the video output

outDir?​

string

The output directory of the rendered video. default="./output"

range?​

[number, number]

The start and end second of the video. Can be used to only render a part of the video.

workers?​

number

The number of processes you want to use to parallelize rendering, default is 1. Rendering a 100s long video with 10 workers means that 10 processes handle 10s of video each. Your laptop will probably render fastest with one worker, but VMs with a lot of computing power can benefit from using more than one

dimensions?​

[number, number]

Dimensions of the video to render as [x,y]. Uses the value specified in project.meta by default.

logProgress?​

boolean

Logs render progress to the console if set to true.

ffmpeg?​

FFmpeg options - is an instance of FfmpegSettings. These overwrite the following settings set through environment variables:

ffmpegLogLevel?​

error | warning | info | verbose, debug | trace

The log level of FFmpeg. Can be one of error, warning, info, verbose, debug, trace. Default is error.

ffmpegPath?​

The path to the FFmpeg binary. If not specified, the FFmpeg binary shipped with Revideo will be used.

puppeteer?​

BrowserLaunchArgumentOptions

Launch options for puppeteer - is an instance of puppeteer's BrowserLaunchArgumentOptions

viteBasePort?​

number

The "base port" we use for the vite server. When you have three workers and a base port 5000, the vite servers created by the three workers will use port 5000, 5001, and 5002. Default is 9000.

viteConfig?​

InlineConfig

Configuration of the vite server used for rendering, an instance of InlineConfig. You can use these options to configure the server port, the cache directory, and more.

progressCallback?​

(worker: number, progress: number) => void

A function that gets called with the progress of the rendering process, can be used to report progress back to users (e.g. in a web app). The function gets called with two arguments: the id of the worker that is calling the function, and the progress of the rendering process (float between 0 and 1). Does nothing by default

Return Value​

The function returns a string containing the path to the rendered video.