Vortex TUI web

Cargo.toml

@@ -137,6 +137,7 @@ datafusion-sqllogictest = { version = "52" }
 dirs = "6.0.0"
 divan = { package = "codspeed-divan-compat", version = "4.0.4" }
 enum-iterator = "2.0.0"
+env_logger = "0.11"
 fastlanes = "0.5"
 flatbuffers = "25.2.10"
 fsst-rs = "0.5.5"
@@ -191,7 +192,7 @@ pyo3-log = "0.13.0"
 quote = "1.0.41"
 rand = "0.9.0"
 rand_distr = "0.5"
-ratatui = "0.30"
+ratatui = { version = "0.30", default-features = false }
 regex = "1.11.0"
 reqwest = { version = "0.12.4", features = [
     "charset",
@@ -235,7 +236,7 @@ tracing-subscriber = "0.3"
 url = "2.5.7"
 uuid = { version = "1.19", features = ["js"] }
 walkdir = "2.5.0"
-wasm-bindgen-futures = "0.4.39"
+wasm-bindgen-futures = "0.4.54"
 xshell = "0.2.6"
 zigzag = "0.1.0"
 zip = "6.0.0"

_typos.toml

@@ -1,5 +1,5 @@
 [default]
-extend-ignore-identifiers-re = ["ffor", "FFOR", "FoR", "typ"]
+extend-ignore-identifiers-re = ["ffor", "FFOR", "FoR", "typ", "ratatui"]
 # We support a few common special comments to tell the checker to ignore sections of code
 extend-ignore-re = [
     "(#|//)\\s*spellchecker:ignore-next-line\\n.*",                      # Ignore the next line

vortex-tui/.gitignore

@@ -0,0 +1 @@
+web/pkg/

vortex-tui/Cargo.toml

@@ -13,32 +13,82 @@ repository = { workspace = true }
 rust-version = { workspace = true }
 version = { workspace = true }
 
+[features]
+default = ["native"]
+native = [
+    "dep:arrow-array",
+    "dep:arrow-schema",
+    "dep:clap",
+    "dep:crossterm",
+    "dep:datafusion",
+    "dep:env_logger",
+    "dep:indicatif",
+    "dep:parquet",
+    "dep:tokio",
+    "dep:vortex-datafusion",
+    "ratatui/crossterm",
+    "vortex/tokio",
+    "vortex/zstd",
+]
+
+[lib]
+crate-type = ["cdylib", "rlib"]
+
+[[bin]]
+name = "vx"
+path = "src/main.rs"
+required-features = ["native"]
+
 [dependencies]
+# Shared dependencies
 anyhow = { workspace = true }
-arrow-array = { workspace = true }
-arrow-schema = { workspace = true }
-clap = { workspace = true, features = ["derive"] }
-crossterm = { workspace = true }
-datafusion = { workspace = true }
-env_logger = { version = "0.11" }
 flatbuffers = { workspace = true }
-futures = { workspace = true, features = ["executor"] }
+futures = { workspace = true }
 fuzzy-matcher = { workspace = true }
 humansize = { workspace = true }
-indicatif = { workspace = true, features = ["futures"] }
 itertools = { workspace = true }
-parquet = { workspace = true, features = ["arrow", "async"] }
 ratatui = { workspace = true }
 serde = { workspace = true, features = ["derive"] }
 serde_json = { workspace = true }
 taffy = { workspace = true }
-tokio = { workspace = true, features = ["rt-multi-thread"] }
-vortex = { workspace = true, features = ["tokio"] }
-vortex-datafusion = { workspace = true }
+vortex = { version = "0.1.0", path = "../vortex", default-features = false, features = [
+    "files",
+] }
+
+# Native-only dependencies (gated behind "native" feature)
+arrow-array = { workspace = true, optional = true }
+arrow-schema = { workspace = true, optional = true }
+clap = { workspace = true, features = ["derive"], optional = true }
+crossterm = { workspace = true, features = ["event-stream"], optional = true }
+datafusion = { workspace = true, optional = true }
+env_logger = { workspace = true, optional = true }
+indicatif = { workspace = true, features = ["futures"], optional = true }
+parquet = { workspace = true, features = ["arrow", "async"], optional = true }
+tokio = { workspace = true, features = [
+    "rt-multi-thread",
+    "macros",
+], optional = true }
+vortex-datafusion = { workspace = true, optional = true }
+
+# WASM-only dependencies
+[target.'cfg(target_arch = "wasm32")'.dependencies]
+console_error_panic_hook = "0.1.7"
+js-sys = "0.3.81"
+ratzilla = "0.3"
+wasm-bindgen = "0.2.104"
+wasm-bindgen-futures = { workspace = true }
+web-sys = { version = "0.3.81", features = [
+    "console",
+    "DataTransfer",
+    "Document",
+    "DragEvent",
+    "Element",
+    "File",
+    "FileReader",
+    "HtmlElement",
+    "HtmlInputElement",
+    "Window",
+] }
 
 [lints]
 workspace = true
-
-[[bin]]
-name = "vx"
-path = "src/main.rs"

vortex-tui/Makefile

@@ -0,0 +1,14 @@
+# SPDX-License-Identifier: Apache-2.0
+# SPDX-FileCopyrightText: Copyright the Vortex contributors
+
+.PHONY: serve clean-web
+
+web/pkg: src/**/*.rs Cargo.toml
+	wasm-pack build --target web --no-default-features --out-dir web/pkg
+
+serve: web/pkg
+	@echo "Open http://localhost:8000"
+	cd web && python3 -m http.server
+
+clean-web:
+	rm -rf web/pkg

vortex-tui/README.md

@@ -107,6 +107,32 @@ vx convert input.parquet --out output.vortex
 vx convert input.parquet --out output.vortex --compress
 ```
 
+## Browser (WASM)
+
+The TUI browser can also run in a web browser via WebAssembly. Users can drag-and-drop a `.vtx`
+file onto a web page and interactively explore it using the same Layout and Segments tabs.
+
+### Quick start
+
+```bash
+# From the vortex-tui directory:
+make serve
+```
+
+This builds the WASM package and starts a local server at `http://localhost:8000`.
+
+Requires `wasm-pack` (`cargo install wasm-pack`).
+
+### How it works
+
+- **Native** builds use `crossterm` for terminal I/O and `CurrentThreadRuntime` (smol-based) for
+  async execution. The `native` feature (enabled by default) pulls in DataFusion, crossterm, and
+  other native-only dependencies.
+- **WASM** builds use [ratzilla](https://github.com/ratatui/ratzilla) (the official ratatui web
+  backend) for rendering and `WasmRuntime` for async execution. Building with
+  `--no-default-features` excludes all native-only dependencies.
+- The Query tab (DataFusion SQL) is only available in native builds.
+
 ## Development
 
 TODO:

vortex-tui/public-api.lock

@@ -94,8 +94,6 @@ pub fn vortex_tui::browse::app::LayoutCursor::dtype(&self) -> &vortex_array::dty
 
 pub fn vortex_tui::browse::app::LayoutCursor::flat_layout_metadata_info(&self) -> alloc::string::String
 
-pub fn vortex_tui::browse::app::LayoutCursor::flatbuffer_size(&self) -> usize
-
 pub fn vortex_tui::browse::app::LayoutCursor::is_stats_table(&self) -> bool
 
 pub fn vortex_tui::browse::app::LayoutCursor::layout(&self) -> &vortex_layout::layout::LayoutRef