Chapter 195: Page responsiveness

Core Idea

The Web Renderer runs in the same browser tab as the page that starts the render.

Key Concepts

• Default behavior
• Changing the setting
• Available values
• "disabled"
• "low"
• "medium"
• "high"
• Number

Code Examples

const Component: React.FC = () => null;

await renderMediaOnWeb({
  composition: {
    id: 'my-composition',
    component: Component,
    durationInFrames: 100,
    fps: 30,
    width: 1920,
    height: 1080,
  },
  pageResponsiveness: 'high',
});

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

Key Takeaways

1. Understand default behavior when working with Page responsiveness.
2. Understand changing the setting when working with Page responsiveness.
3. Understand available values when working with Page responsiveness.
4. Understand "disabled" when working with Page responsiveness.
5. Understand "low" when working with Page responsiveness.

Connects To

• Animatedimage: related page in the Assets & Media section.
• Delaying: related page in the Assets & Media section.
• Exporting: related page in the Assets & Media section.