Timeline Editing Basics
Learn how to work with the multi-track timeline in detail. Master clip cutting, trimming, moving, link operations, and navigation shortcuts.
Multi-Track Timeline Overview
The VideoBuff timeline supports multiple track types. You can freely add video tracks, audio tracks, text tracks, and image tracks, layering them on top of each other.
Tracks higher in the stack appear in front, and their order can be changed by dragging. Each track can be independently muted or locked, which is useful when you want to focus on editing a specific layer.
Track headers on the left side of the timeline let you rename tracks and add or remove them.
Basic Clip Operations
Click a clip to select it, then drag to move it within the same track or to a different track. Hold Shift and click to select multiple clips. Delete selected clips with the Delete or Backspace key.
When dragging clips, they snap to the edges of adjacent clips and to the playhead for precise, gap-free placement. Snapping can be toggled on and off using the magnet icon on the timeline.
Cut and Trim
Press C to activate the cut tool (razor tool), then click anywhere on a clip to split it at that point. You can also split at the playhead position by selecting a clip and using the keyboard shortcut.
Hover over the edge of a clip to reveal trim handles, then drag to adjust the in-point or out-point. Trimming is non-destructive, meaning the original media is never lost — you can always undo a trim to extend the clip again.
This allows you to experiment freely to find the perfect timing.
Link and Unlink
When you import a video file, its video and audio components are automatically linked together. Linked clips move and delete in sync, preventing the video and audio from going out of alignment.
If you want to adjust audio on a separate track or edit video and audio independently, use the unlink function. After unlinking, you can move and delete the video clip and audio clip separately.
To re-link them, select both clips and perform the link operation.
Zoom and Navigation
Zoom the timeline with Ctrl+Mouse Wheel (Cmd+Wheel on Mac) in a range from 0.25x to 8x. Zooming in allows you to see individual frames, which is ideal for precision editing.
Press Home to jump to the beginning of the timeline and End to jump to the end. Shift+Arrow keys let you jump in 1-second increments, useful for rough positioning.
The playhead can be moved to any position by clicking, and you can scrub through your project by dragging it.
Technical Note: Project State Management
The timeline state is managed by a Zustand store, and all editing operations are recorded in an undo/redo history of up to 50 steps. Press Ctrl+Z (Cmd+Z) to undo and Ctrl+Shift+Z (Cmd+Shift+Z) to redo.
Project state is auto-saved to IndexedDB approximately every second, so you can recover from the most recent state even if the browser closes unexpectedly. This auto-save uses a differential approach to minimize performance impact.