Lattice Grid Buy a licence

the grid · v1.13.0

A million rows, and it does not flinch.

Lattice Grid holds data in columns rather than rows, and virtualises both axes, so the work it does is proportional to what is on screen, not to what is loaded. A million rows scroll at the frame rate; a hundred columns cost only the dozen in view. Everything below runs in the browser, on the same one build, no framework required.

Building…
Loading a live grid…

grouping, totals and pivot

From rows to the few numbers someone asked for.

Group by one column or several and the grid folds the rows into each group, showing the total you asked for and opening to the real rows underneath. The reductions run over the data, not the page, so a total is the total whether or not its rows are on screen. Or pivot, and the distinct values of a field become columns of their own.

Building…
Loading a live grid…

tree data and master-detail

Hierarchies, and the detail underneath a row.

A row can open into a nested grid of its own, line items under an order, trades under a book, and a column can carry a tree the grid expands lazily as branches are opened. The detail is a full instance of the grid, so the same types, editors and validators apply three levels down as they do at the top.

Building…
Loading a live grid…

a type per column

A type is not a label.

A column's type is its storage, its comparator, its parser, its formatter and its editor, all declared in one line. A number sorts and right-aligns numerically; a date compares by calendar rather than by string; a duration, a bytes or an ipv4 stores one value and renders it the way a person reads it. Nothing here is inferred row by row. And there are 88 of them registered, from currency and percentages to IP addresses, molarity and a dozen unit families, before you write one of your own.

Building…
Loading a live grid…

Every type → The built-in types → A unit family of your own → A type of your own →

sources and live data

In-memory, paged, remote or streaming.

The same grid reads from an array in the page, a server that pages and filters on its own, or a stream that mints rows as they arrive. Updates are coalesced onto a frame, so a feed of thousands of changes a second is one repaint per frame rather than one per message, and the rate below is what your browser actually applied, measured as it runs.

Building…
Loading a live grid…

One million rows → Sort at scale → Two hundred columns → Pivot → Grouping → Master & detail → Tree data → Ten thousand updates → Streaming source →

Complete, and framework-free

Sorting, filtering, grouping, editing and export are already in the box, so you ship the screen instead of building the grid. Mount it on a div in React, Vue, Svelte or plain HTML, with no build step and the TypeScript types alongside, and it behaves the same everywhere.

Not a viewer. A workspace.

Reading data is the easy half. Editing is where a demo becomes a product: type, fill, paste from Excel and undo the lot, with every write checked before it lands and rolled back if the server says no.

Rows in, answers out

Point charts at the grid and they draw straight from its live rows. Open the statistics layer and it tells you what the numbers say, and how far they have moved since you last looked.