Chapter 144: makeCancelSignal()

Core Idea

_Part of the @remotion/renderer package.

Key Concepts

• Example
• API
• Compatibility
• See also

Code Examples

const composition: VideoConfig = {
  durationInFrames: 1000000,
  fps: 30,
  height: 720,
  id: 'react-svg',
  width: 1280,
  defaultProps: {},
  props: {},
  defaultCodec: null,
  defaultOutName: null,
  defaultVideoImageFormat: null,
  defaultPixelFormat: null,
  defaultProResProfile: null,
  defaultSampleRate: null,
};

const {cancelSignal, cancel} = makeCancelSignal();

// Note that no `await` is used yet
const render = renderMedia({
  composition,
  codec: 'h264',
  serveUrl: '/path/to/bundle',
  outputLocation: 'out/render.mp4',
  cancelSignal,
});

// Cancel render after 10 seconds
setTimeout(() => {
  cancel();
}, 10000);

// If the render completed within 10 seconds, renderMedia() will resolve
await render;

// If the render did not complete, renderMedia() will reject
// ==> "[Error: renderMedia() got cancelled]"

• What it demonstrates: Usage pattern for makeCancelSignal() from the official docs.

Key Takeaways

1. Understand example when working with makeCancelSignal().
2. Understand api when working with makeCancelSignal().
3. Understand compatibility when working with makeCancelSignal().
4. Understand see also when working with makeCancelSignal().

Connects To

• Chromium Flags: related page in the Rendering & SSR section.
• Compare ssr: related page in the Rendering & SSR section.
• Dataset Render: related page in the Rendering & SSR section.