Skip to main content

v5.0 Migration

note

Remotion 5.0 is not yet released. This is an incomplete list of breaking changes that are planned for the release.

How to upgrade​

See the changelog to find the latest version. Upgrade remotion and all packages starting with @remotion to the latest version, e.g. 5.0.0:

- "remotion": "4.0.141"
- "@remotion/bundler": "4.0.141"
- "@remotion/eslint-config": "4.0.141"
- "@remotion/eslint-plugin": "4.0.141"
- "@remotion/cli": "4.0.141"
- "@remotion/renderer": "4.0.141"
+ "remotion": "5.0.0"
+ "@remotion/bundler": "5.0.0"
+ "@remotion/eslint-config": "5.0.0"
+ "@remotion/eslint-plugin": "5.0.0"
+ "@remotion/cli": "5.0.0"
+ "@remotion/renderer": "5.0.0"

Run npm i , yarn, pnpm i or bun i respectively afterwards.

Four packages are no longer published​

The following packages stop receiving releases after the 4.x line:

Required action: Migrate usages and remove these packages from your dependencies before upgrading. Existing 4.x versions remain available, but no 5.x versions will be published.

Runtime requirements​

The minimum Node version is now 16. The minimum Bun version is 1.0.3.

If you use @remotion/eslint-config, the minimum ESLint version is now 7.15.0.

WebGL and WebGPU during rendering are now enabled by default​

In Remotion 4.0, the default OpenGL renderer was null, which would not enable WebGL or WebGPU.

In Remotion 5.0, the default is angle with automatic fallback to swangle. Lambda and Cloud Run continue to use swangle by default, because they have no GPU.

Required action: If you used --gl=angle before, you can now remove it.

selectComposition() and getCompositions() now require inputProps​

inputProps is now required in selectComposition() and getCompositions().
A common footgun was the render was not working as intended because the input props were not passed.

Required action: Pass an empty object {} if you don't have any input props.

bundle() and getCompositions() now take an options object​

The legacy positional signatures of bundle() and getCompositions() have been removed. The return value of bundle() remains the output directory as a string.

Required action: Move positional arguments into an options object:

Before and after
- bundle(entryPoint, onProgress, options)
+ bundle({entryPoint, onProgress, ...options})

- getCompositions(serveUrl, options)
+ getCompositions({serveUrl, ...options})

visualizeAudio() yields different result​

optimizeFor: "speed" is now the default. This will yield slightly different results.

Required action: Review the visualization of your audio. If unsatisfactory, revert to the old behavior by setting optimizeFor: "accuracy".

TransitionSeries does not support layout="none" anymore​

Having a TransitionSeries with layout="none" is not supported anymore.
It never made sense to have this prop as transitioned elements need to be positioned absolutely.

Required action: Remove the layout prop.

measureSpring() does not accept from and to options anymore​

The values passed in there did not influence the calculation at all. Therefore we removed those options.

Required action: Remove the from and to options from your code.

Path sampling returns null beyond the end of a path​

getPointAtLength() and getTangentAtLength() now return null if the requested length is greater than the return value of getLength(). Previously, they returned the point or tangent at the end of the path.

Required action: Handle the null return value or ensure that the requested length does not exceed the path length.

overwrite is now true by default in renderMediaOnLambda()​

The default value of overwrite has been changed to true in renderMediaOnLambda(). This skips a check that the file already exists in the S3 bucket, which makes the render start faster.

Required action: If you want to keep the old behavior, set overwrite: false, explicitly.

openBrowser() now takes a logLevel instead of shouldDumpIo​

The shouldDumpIo option has been be removed in 5.0.
Use logLevel: "verbose" instead.

getVideoMetadata() has been removed from @remotion/renderer​

Use Mediabunny to get video metadata instead.

Required action: Replace calls to getVideoMetadata() from @remotion/renderer with getting metadata using Mediabunny.

diskSizeInMb is now 10240 by default​

For Remotion Lambda, the default disk size is now 10240 MB.
This will add a miniscule cost to your renders technically, but will lead to more reliable and faster renders, since Chrome is less likely to run out of disk cache.

Required actions:

  • If you want to keep the old behavior, set diskSizeInMb: 2048, explicitly.
  • If your Lambda function name is hardcoded to include disk2048mb, unhardcode it and use speculateFunctionName() to get the correct name.

Some APIs should be imported from @remotion/lambda/client​

renderMediaOnLambda(), getRenderProgress(), renderStillOnLambda(), presignUrl(), getSites() have been removed from @remotion/lambda.
They are now available in @remotion/lambda/client.

Cloud Run services use a lower maximum instance count​

The default maxInstances for new Cloud Run services has been reduced from 100 to 5. On some GCP accounts, the previous default exceeded the available Cloud Run quota and caused deployments to fail with an Invalid value specified for cpu error.

Required action: If you want to keep the old scaling limit, set maxInstances: 100 when using deployService(), or pass --maxInstances=100 to the Cloud Run CLI.

bt709 is now the default color space​

The default colorSpace is now "bt709" instead of "default" (which was equivalent to "bt601"). The "default" option has been removed.

Required action: If you want to keep the old behavior, set colorSpace: "bt601" explicitly.

@remotion/google-fonts requires specifying weights and subsets​

When using loadFonts() from @remotion/google-fonts, you must now specify which font weights and subsets you want to load. Loading all weights and subsets by default is no longer supported as it can lead to timeouts.

Required action: Explicitly specify the weights and subsets you need:

import {loadFont} from '@remotion/google-fonts/Roboto';

loadFont('normal', {
	weights: ['400', '700'],
	subsets: ['latin'],
});

validateFontIsLoaded is now true by default in @remotion/layout-utils​

measureText(), fitText(), fillTextBox(), and fitTextOnNLines() now default validateFontIsLoaded to true.

Required action: Ensure custom fonts are loaded before calling these APIs, or pass validateFontIsLoaded: false explicitly to keep the previous behavior. See layout utils best practices.

Sequences are automatically premounted​

<Sequence>, <Series.Sequence> and <TransitionSeries.Sequence> components now automatically premount for 1 second (fps frames) before they appear. This prevents black frames that were commonly seen when a <Sequence> containing heavy content (e.g. videos, images) appeared.

Required action: If you don't want this behavior for a specific Sequence, opt out by passing premountFor={0}.

Media and images pause playback while loading​

<Video> and <Audio> from @remotion/media have paused playback while loading by default since they were introduced.

<Html5Video>, <OffthreadVideo>, and <Html5Audio> now set pauseWhenBuffering to true by default. <Img> now sets pauseWhenLoading to true by default. This prevents the Player from continuing while media or images are still loading.

Required action: If you want to keep the old behavior, set pauseWhenBuffering={false} on video and audio components and pauseWhenLoading={false} on <Img> explicitly.

License changes​

Remotion 5.0 has an updated license. View the license here or compare the changes.

There are two effective changes in this license:

  • Contractors now also count towards team size. Previously, a company could work exclusively with contractors and never have to get a company license.
  • For customers, the license is now tied to our updated terms and conditions. Previously, our terms were generated by a Terms and conditions generator and did not make sense. We updated them to make sense in the context of Remotion.