Chapter 344: Premounting

Core Idea

Remotion only ever renders the current frame. This means when a video or another asset is about to come up, it is not loaded by default.

Key Concepts

• What is premounting?
• Premounting components
• With <Series> and <TransitionSeries>
• Custom premount component
• Usage together with the buffer state
• See also

Code Examples

const MyComp: React.FC = () => {
  return (
    <Video
      from={100}
      premountFor={100}
      src={staticFile('bigbuckbunny.mp4')}
    />
  );
};

• What it demonstrates: Usage pattern for Premounting from the official docs.

Key Takeaways

1. Understand what is premounting? when working with Premounting.
2. Understand premounting components when working with Premounting.
3. Understand with <series> and <transitionseries> when working with Premounting.
4. Understand custom premount component when working with Premounting.
5. Understand usage together with the buffer state when working with Premounting.

Connects To

• Clipper: related page in the Studio, Player & Editing section.
• Design Systems: related page in the Studio, Player & Editing section.
• Editor Starter: related page in the Studio, Player & Editing section.