Available now
Robot recordings,
right in your application.
The MCAP toolkit reads MCAP recordings in the browser: ROS 1, ROS 2, protobuf and JSON messages. Watch every camera and chart every signal on one timeline with a ready-made viewer, or build an interface of your own.
Choose your starting point
Both packages are on npm. The React components need the reader installed next to them; the reader works on its own.
npm i @videodb/robopeek-react @videodb/robopeek-mcapimport { McapViewer } from '@videodb/robopeek-react/mcap'
import '@videodb/robopeek-react/styles.css'
export function RecordingPreview({ url }: { url: string }) {
return (
<div style={{ height: 640 }}>
<McapViewer source={url} />
</div>
)
}Learn by changing a working example
A live preview and its source code, side by side with the controls.
Ready-made viewer
Every camera, signal chart and topic of a recording. Add a source and start exploring.
Compose your player
Combine built-in player parts with your own controls, all sharing one playback state.
Build your own UI
Use the reader on its own. Take decoded recordings into any JavaScript interface.
Styling & themes
Try themes and tune colors, typography, and corners with a live token editor.
Show & hide parts
Choose the cameras, signals, topics, and controls your application needs.
Start with real robot recordings
Public recordings, streamed from Hugging Face. You can also use your own file or URL.
What is supported?
MCAP files with ROS 1, ROS 2 (CDR), protobuf or JSON messages, in zstd- or lz4-compressed chunks. Cameras can be JPEG/PNG, raw pixels, 16-bit depth or H.264 video. Remote files must allow CORS; with HTTP Range support they open from their index and stay under a memory budget. Not yet: ros2idl schemas, FlatBuffers, CBOR, and H.265 / VP9 / AV1 video.
