Skip to main content

studio-perf

Optimize Remotion Studio render performance by minimizing frame-reactive component surfaces, preferring imperative timeline state reads, and memoizing stable render boundaries. Use when code reads the current frame with `useTimelinePosition()` or components unnecessarily render on every frame.

Source facts

Repository
remotion-dev/remotion
Last source activity
August 4, 2026 at 13:16
Detected SKILL.md language
English
Stars
70,964
Forks
5,852

Install options

The review-first prompt is selected by default. You can switch to a direct command or download a local copy.

Review the source files

Read SKILL.md and any companion files shown by SkillsMP before deciding whether to install.

File Explorer
2 files

Showing SKILL.md

SKILL.md
Source instructions · Read-only preview
name
studio-perf
description
Optimize Remotion Studio render performance by minimizing frame-reactive component surfaces, preferring imperative timeline state reads, and memoizing stable render boundaries. Use when code reads the current frame with `useTimelinePosition()` or components unnecessarily render on every frame.
# Studio Performance ## Minimize frame subscriptions Keep dependencies on the current frame as low in the component tree as possible. Prefer imperative timeline state reads such as `getCurrentFrame()` over `Internals.Timeline.useTimelinePosition()` for event handlers and other on-demand logic. Use `useTimelinePosition()` only in the smallest leaf component whose rendered output must change with the frame. If a parent reads the frame only to pass it to a child, extract a frame-subscribing child so the parent and its other descendants stay stable. ## Memoize stable boundaries Wrap components in `React.memo()` when they can safely skip parent-driven renders. Confirm that their props remain referentially stable across frame updates: newly created objects, callbacks, styles, or React nodes defeat shallow memoization. Stabilize those props only where it is natural; avoid custom comparators that ignore behaviorally relevant changes. Context subscribers continue to update through memoized ancestors. Prefer a memoized stable parent with a small frame-subscribing leaf over making the whole subtree reactive to the current frame.
View on GitHub