Skip to content
gpu-components
GPUDataGrid

Data grid

Scroll to move through the 5,000 rows, hold shift and scroll to move across columns, and click a row to select it. Watch the per-cell tint: colour is computed per cell in the fragment shader from where each value sits in its column’s range.

GPUDataGrid — the flagship, built last on purposeclick a row
wheelscroll rowsshift + wheelscroll columnsclickselect a rowTab then arrowswalk rows

A hybrid, and the split is measured rather than assumed. The GPU draws zebra striping and the per-cell conditional formatting — every numeric cell tinted by where its value sits in that column's full range, evaluated in the fragment shader. The text is a Canvas2D layer: measured at 2,400 cells of it rendering in 2.9ms per frame with zero dropped frames, against a glyph atlas that would have been the larger, more schedule-consuming alternative. The DOM draws nothing per cell: it dropped every frame past ~1,200 nodes. Read-only in v1 — editing, copy/paste and column resize are grid semantics substantial enough to warrant their own pass.