@rerun-io/web-viewer-react

Rerun web viewer

Embed the Rerun web viewer within your React app.

If you'd like to use a framework-agnostic package instead, see https://www.npmjs.com/package/@rerun-io/web-viewer.

Install

$ npm i @rerun-io/web-viewer-react

ℹ️ Note: The package version is equal to the supported Rerun SDK version, and RRD files are not yet stable across different versions. This means that @rerun-io/web-viewer-react@0.10.0 can only connect to a data source (.rrd file, websocket connection, etc.) that originates from a Rerun SDK with version 0.10.0!

Usage

import WebViewer from "@rerun-io/web-viewer-react";

export default function App() {
  return <WebViewer width="800px" height="600px" rrd="...">
}

The rrd in the snippet above should be a URL pointing to either:

• A hosted .rrd file, such as https://app.rerun.io/version/0.19.0/examples/dna.rrd
• A WebSocket connection to the SDK opened via the serve API

If rrd is not set, the Viewer will display the same welcome screen as https://app.rerun.io. This can be disabled by setting the hide_welcome_screen prop to true.

⚠ It's important to set the viewer's width and height, as without it the viewer may not display correctly. Setting the values to empty strings is valid, as long as you style the canvas through other means.

ℹ️ Note: This package only targets recent versions of browsers. If your target browser does not support Wasm imports or top-level await, you may need to install additional plugins for your bundler.

Changelog

0.19.0 - Dataframes & Video support

📖 Release blogpost: https://rerun.io/blog/dataframe

🧳 Migration guide: http://rerun.io/docs/reference/migration/migration-0-19

✨ Overview & highlights

This release introduces two powerful features: a dataframe API (and view), as well as video support.

☰ Dataframe API

We now have an API for querying the contents of an .rrd file. This integrates with popular packages such as Pandas, Polars, and DuckDB.

You can read more in the Dataframe API how-to guide.

We have also added a matching dataframe view inside the Rerun Viewer. Read more here.

🎬 Video

Rerun now supports logging MP4 videos using the new AssetVideo archetype. This can greatly reduce bandwidth and storage requirements.

While the web viewer supports a variety of codecs, the native viewer supports only the AV1 codec for the moment, but we plan to support H.264 in the near future as well. Read more about our video supports (and its limits) in our video docs.

⚠️ Breaking changes

• 🗾 Blueprint files (.rbl) from previous Rerun versions will no longer load automatically
• 🐧 Linux: Rerun now requires glibc 2.17+
• 🦀 Rust: The minimum supported Rust version is now 1.79

🧳 Migration guide: http://rerun.io/docs/reference/migration/migration-0-19

🔎 Details

📑 Raw changelog: https://github.com/rerun-io/rerun/compare/0.18.2...0.19.0

🪵 Log API

• BGR(A) image format support #7238
• Tensor & depth image value ranges can now be configured, from UI & code #7549
• New planar pixel formats: Y_U_V24/Y_U_V16/Y_U_V12 - _LimitedRange/FullRange #7666
• Add ShowLabels component, which controls whether instances’ labels are shown #7249 (thanks @kpreid!)
• Refactor MediaType guessing #7326

🌊 C++ API

• Add nullptr check when forwarding from component to datatype #7430

🐍 Python API

• Add missing show_labels and draw_order arguments in Python API #7363 (thanks @kpreid!)
• Allow logging to a recording without first calling rr.init() #7698
• Add support for NumPy arrays to the arrow serializer for string datatypes #7689

🦀 Rust API

• Update MSRV to Rust 1.79 #7563
• Update ndarray to 0.16 and ndarray-rand to 0.15 #7358 (thanks @benliepert!)
• Replace host_web_viewer method with WebViewerConfig::host_web_viewer #7553
• Fix Rust's TimeColumn::new_seconds/new_nanos creating sequence timelines #7402

🪳 Bug fixes

• Purge the query cache to prevent GC livelocks #7370
• Bug fix: always show latest data in follow-mode #7425
• Fix encoded image being suggested for non-image blobs (like video) #7428
• Chunk store: support for overlapped range queries #7586
• Fix image & video cache creating new entries when selecting data without explicit media type #7590

🌁 Viewer improvements

• The viewer will tail an .rrd that's is being written to #7475
• Native video support for AV1 #7557
• Allow splitting entity path expressions with whitespace #7782

🚀 Performance improvements

• Improve performance for scenes with many entities & transforms #7456
• Caches per recording #7513
• Automatic removal of unreachable static chunks #7518
• Invalidate hub-wide caches on deletions and overwrites #7525
• Do not cache static entries in the query-time latest-at cache #7654
• Make sure Arrow filter and take kernels early out where it makes sense #7704

🧑‍🏫 Examples

• Add drone LiDAR example #7336
• Add instant_splat example #7751 (thanks @pablovela5620!)

📚 Docs

• Add video reference docs #7533
• Document that Rerun does not support left-handed coords #7690
• Add a How-to guide for the dataframe API #7727
• Docs: move "roadmap" down to "development" #7775
• Add a "Getting started" guide for the dataframe API #7643
• Docs: clean up reference menu #7776
• Updating "Navigating the viewer" #7757

🖼 UI improvements

• Add a hook for views to add additional UI in the tab title bar #7438
• Text fields in the selection panel now span the available width #7487
• Do not deselect on ESC when it was used to close some other UI element #7548
• Add UI for precisely picking an exact sequence time #7673
• Remove the feature flag for plot query clamping #7664

🎨 Renderer improvements

• Introduce image data conversion pipeline, taking over existing YUV conversions #7640

🧑‍💻 Dev-experience

• Add a command palette action to reset egui's memory (debug build only) #7446
• Add NOLINT block to lint.py #7720