Examples
The repository’s examples range from a minimal quick start to full
applications built on the grid, and include the headless benchmark. Each
one runs with cargo run from a checkout of the repository; the
Getting started page lists what a checkout needs. The trading
examples and most of the others load their fonts first, with
python3 -I script/fetch-example-fonts; orbit and transit fetch their
data once with script/fetch-orbit-data and script/fetch-transit-data.
A demo in the browser downloads about 7 MB of WebAssembly, only when you ask for it, and runs one at a time on this page. Open full page shows the same example on a page of its own, with the switcher to the others. Prices in the market examples and everything in ops are simulated; the licences page says where the other data comes from.
In the browser
These run natively and, compiled to WebAssembly, in this page: each poster becomes the running example on a click. Their data comes from the page's own simulator, a timetable or a public live source, straight to your browser.
Open full page quotesLive quotes, grouped by sector150 simulated quotes grouped by sector with live averages in the captions, on the desk’s simulator and its Depth theme. Built for the browser only; the gateway in crates/grid-gateway can feed it over WebSocket.
Source:make -C crates/grid-web build servecrates/grid-web/apps/quotes
Open full page deskA keyboard-first trading terminalA command line, a watchlist grouped by sector, a candle chart, an order book shaded by depth, a trades tape, positions as a tree and a news grid, in three themes switched with F2–F4. Every price is simulated.
Source:cargo run --release -p gpui-kit-grid --example deskcrates/grid/examples/desk
Open full page brokerA light retail broker appA watchlist with tall rows and no grid lines, an area chart, an order ticket whose simulated orders fill against the simulated quotes, and positions, orders and movers, in light and dark themes.
Source:cargo run --release -p gpui-kit-grid --example brokercrates/grid/examples/broker
Open full page opsA data center during an incident stormOver a thousand alert updates a second collapse into one live row per alert, sorted by severity and rate, beside a fleet of thousands of hosts as a live tree with roll-ups. Everything is simulated; F8 starts a storm.
Source:cargo run --release -p gpui-kit-grid --example opscrates/grid/examples/ops
Open full page orbitEverything in orbit right nowAbout 17,000 active satellites from CelesTrak’s public elements, propagated every second and sorted by elevation, so the table reorders on every update; flat, by constellation, or as a tree of orbital shells.
Source:cargo run --release -p gpui-kit-grid --example orbitcrates/grid/examples/orbit
Open full page transitMunich by the timetableEvery train, tram and city bus that MVV’s published timetable says is under way, placed between its stations and updated every second, with a map and a station’s board of departures. A bar shows each vehicle’s progress to its next station; W runs the clock ×10 or ×60, and the timetable keeps pace. Scheduled, not real-time.
Source:cargo run --release -p gpui-kit-grid --example transitcrates/grid/examples/transit
Open full page transitHelsinki, liveThe same example on HSL’s high-frequency positioning: every tram, metro, train and ferry in Helsinki, live from HSL to your browser, a row per vehicle with its delay and next stop.
Source:TRANSIT_CITY=helsinki cargo run --release -p gpui-kit-grid --example transitcrates/grid/examples/transit
Open full page wikiThe world editing WikipediaOne row per Wikimedia wiki, sorted by edits in the last minute, from Wikimedia’s public EventStreams; a seismograph of the last minute beside it. The stream opens only when you press Start; Replay plays a recording.
Source:cargo run --release -p gpui-kit-grid --example wikicrates/grid/examples/wiki
Open full page shipsEvery vessel around FinlandAbout 700 vessels live from Digitraffic’s open AIS data, a row each updated in place and sorted by speed, with a map drawn by the vessels themselves. A vessel silent for ten minutes dims, and after thirty it fades out.
Source:cargo run --release -p gpui-kit-grid --example shipscrates/grid/examples/ships
Native only
These run on the desktop, from a checkout of the repository.
quickstartThe minimal application1000 trades that a producer thread keeps updating, sorted by price, with selection by key: the code the Start page walks through.
Source:cargo run --release -p gpui-kit-grid --example quickstartcrates/grid/examples/quickstart.rscookbookThe Cookbook’s recipesA quotes window whose toolbar runs the recipes of the Cookbook page: a reload with progress, a held order, a saved layout, an export of your own, and quotes from the WebSocket gateway.
Source:cargo run --release -p gpui-kit-grid --example cookbookcrates/grid/examples/cookbook.rsblotterA trade blotter with every core featureReorder policy and Refresh order, reload under the live stream with progress, quick filter, grouping with aggregates in the captions, a totals row, pinned columns, tooltips, copy, and the column chooser.
Source:cargo run --release -p gpui-kit-grid --example blottercrates/grid/examples/blotterportfolioA live treeFunds, desks, books and positions in one column with chevrons, the books’ and desks’ sums written by the producer, totals over the leaves, and a quick filter that keeps the ancestors of matches.
Source:cargo run --release -p gpui-kit-grid --example portfoliocrates/grid/examples/portfoliodock_layoutGrids in a dock, layout savedThe column layout and named layouts saved to a file and restored at startup, with a group panel in each trades tab.
Source:cargo run --release -p gpui-kit-grid --example dock_layoutcrates/grid/examples/dock_layout.rsordersEditing under live updatesA trader’s orders edited in place while the market streams in: every built-in editor, a “server” that confirms, rejects or conflicts with each commit, widgets in cells, CSV export and drag and drop.
Source:cargo run --release -p gpui-kit-grid --example orderscrates/grid/examples/ordersladderA futures price ladderEach row a fixed price, so sizes tick in place: working orders, bid, ask and volume at each price, with a tape, a candle chart and P&L. Simulated exchange.
Source:cargo run --release -p gpui-kit-grid --example laddercrates/grid/examples/ladderwireA news and analytics workstationA news monitor grid with unread stories in bold and category chips, the open story with live quotes, and a market overview grouped by sector. Stories come from neutral templates over the simulated quotes.
Source:cargo run --release -p gpui-kit-grid --example wirecrates/grid/examples/wireperfA live process and GPU monitorEvery process of this machine with its CPU, GPU, memory, disk and threads, sampled every second and written to the grid from a thread of its own, the machine’s totals pinned on top; a tree by parent process, a flat list, or grouped by user or app. Nothing is simulated. macOS and Linux; on Windows the GPU columns stay blank.
Source:cargo run --release -p gpui-kit-grid --example perfcrates/grid/examples/perfspike_benchThe headless benchmarkEvery scenario on the Performance page, and the comparison with gpui-kit’s DataTable, measured with headless Metal on macOS.
Source:cargo run --release -p gpui-kit-grid --features test-support --example spike_benchcrates/grid/examples/spike_bench.rs
Apache-2.0, built on gpui-kit. Repository Sponsor More from GigLabo Privacy Licenses