Remotion Rule: Get Audio Duration
Remotion skill rule: Getting the duration of an audio file in seconds with Mediabunny. Part of the official Remotion Agent Skill for programmatic video in React.
Agent 可直接安装
这个资产可安装;Agent 先选择当前运行时、检查安装计划,再运行匹配命令。
npx -y tokrepo@latest install c14c3bd1-b513-4d4e-9194-0379445fe785 --target codex先 dry-run 确认安装计划,再运行此命令。
What it is
This Remotion rule instructs AI coding agents on how to get the duration of an audio file in seconds using Mediabunny within Remotion projects. Knowing the exact audio duration is essential for synchronizing video compositions with background music, voiceovers, or sound effects.
The rule targets developers using AI assistants to build Remotion video projects that need frame-accurate audio synchronization.
How it saves time or tokens
Without this rule, AI agents often guess at audio durations or suggest incorrect APIs for measuring them. The rule provides the exact Mediabunny function call and demonstrates how to convert the duration into frame counts for Remotion compositions, eliminating debugging time.
How to use
- Add the Remotion audio duration rule to your project's AI configuration.
- Ask your AI assistant to create a composition that matches the length of an audio file.
- The agent uses Mediabunny to measure the duration and sets the composition's
durationInFramesaccordingly.
Example
import { getAudioDurationInSeconds } from '@remotion/media-utils';
import { Composition, Audio, staticFile } from 'remotion';
// Calculate composition duration from audio length
const fps = 30;
export const RemotionRoot: React.FC = () => {
return (
<Composition
id='AudioVideo'
component={AudioVideo}
fps={fps}
width={1920}
height={1080}
calculateMetadata={async () => {
const duration = await getAudioDurationInSeconds(
staticFile('voiceover.mp3')
);
return {
durationInFrames: Math.ceil(duration * fps),
};
}}
/>
);
};
const AudioVideo: React.FC = () => (
<Audio src={staticFile('voiceover.mp3')} />
);
Related on TokRepo
- AI Tools for Video -- video creation and editing tools for developers
- AI Tools for Automation -- automation tools for media workflows
Common pitfalls
getAudioDurationInSecondsis async and must be called insidecalculateMetadataor adelayRenderblock, not during render.- Supported formats depend on the browser and FFmpeg availability. MP3 and WAV are universally supported; OGG may not work in all environments.
- Audio files in the public directory must be referenced with
staticFile(). Direct file paths cause rendering failures in production.
常见问题
Remotion compositions require a fixed durationInFrames value. To match the composition length to an audio file, you need to measure the audio duration in seconds and multiply by the fps. Without this, the video may cut off early or have excess silence.
Mediabunny is the internal name for Remotion's media utilities package (@remotion/media-utils). It provides functions like getAudioDurationInSeconds and getVideoMetadata for measuring media file properties.
Yes. The @remotion/media-utils package also exports getVideoMetadata which returns duration, width, height, and fps of video files. The pattern is identical to audio duration measurement.
Yes, but remote URLs add network latency and potential CORS issues. For reliable rendering, prefer local audio files via staticFile(). If using remote URLs, ensure CORS headers are configured on the server.
getAudioDurationInSeconds returns the duration as reported by the browser's audio decoder, which is accurate to within a few milliseconds. This is precise enough for frame-level synchronization at standard video frame rates.
引用来源 (3)
- Remotion Audio Duration Docs— getAudioDurationInSeconds from @remotion/media-utils
- Remotion Dynamic Metadata Docs— calculateMetadata for dynamic composition duration
- Remotion GitHub— Official Remotion Agent Skill
来源与感谢
Created by Remotion. Licensed under MIT. remotion-dev/skills — Rule:
get-audio-duration
Part of the Remotion AI Skill collection on TokRepo.
讨论
相关资产
Remotion Rule: Transcribe Captions
Remotion skill rule: Transcribing audio to generate captions in Remotion. Part of the official Remotion Agent Skill for programmatic video in React.
Remotion Rule: Get Video Duration
Remotion skill rule: Getting the duration of a video file in seconds with Mediabunny. Part of the official Remotion Agent Skill for programmatic video in React.
Remotion Rule: Get Video Dimensions
Remotion skill rule: Getting the width and height of a video file with Mediabunny. Part of the official Remotion Agent Skill for programmatic video in React.
Remotion Rule: Sequencing
Remotion skill rule: Sequencing patterns for Remotion - delay, trim, limit duration of items. Part of the official Remotion Agent Skill for programmatic video in React.