Benchmarks

These benchmarks compare gp-grid against other popular data grid libraries on a single 1,000,000-row dataset, using an identical set of columns and the same seeded data for every grid. Each metric below is the median across repeated iterations. The exact machine, runtime and library versions used for this run are listed with the results so the numbers are reproducible.

Methodology

• Same data, same columns. Every grid renders the same deterministically generated rows and columns; only the grid under test changes.
• Windowed virtualization. All grids keep just the visible row window in the DOM. gp-grid caps its scroll container at 10,000,000px because browsers mis-render taller elements; above ~312,000 rows (at a 32px row height) the natural content height exceeds that cap, so gp-grid compresses the scroll space (a scroll ratio below 1) and maps the scrollbar position back to logical row coordinates. At 1,000,000 rows this compression is active. Grids that instead render a full-height spacer (row count × row height) rely on the browser's own maximum element-height limits.
• Identical wheel input. The measured scroll sends the same synthetic mouse-wheel events to every grid. Each grid's scroll and virtualization model translates that input into a different travelled distance (custom scrollbars and dampened virtual-scroll wheel handling rescale the deltas), so instead of forcing an equal distance through grid-specific APIs, the tables report Rows Traversed — how many rows each grid actually covered under the same input.
• Mode column. Each table lists how a grid is wired up. native-grid is a shipped grid component; headless-table-virtualizer supplies only the data/virtualization model while the benchmark authors the DOM; app-side-virtual-data feeds a virtual data source from the benchmark. The Notes section below the results spells out the per-grid details.

Metrics Explained

Run Details

• Run: 2026-07-16T10-29-40-792Z
• Date: 2026-07-16T10:29:40.796Z
• Machine: Intel(R) Core(TM) Ultra 7 258V
• Environment: win32 10.0.26200, 8 logical CPUs, 32244 MB RAM
• Runtime: Node v24.14.0, Chrome 150.0.7871.116
• Config: 10 iterations, 1 Playwright worker, retries 0, overscan 10 rows, 32px row height, 1280x720, headless true
• Scope: DOM-rendering grids. Canvas-rendering grids are excluded: their painting model is not directly comparable.

Library Versions

Package Bundle Sizes

Production ESM JavaScript and CSS bundles of the exact grid-library imports used by each benchmark, minified by Vite and measured with gzip. React and React DOM peer dependencies are excluded; bundled transitive dependencies and imported CSS are included, while other emitted assets are excluded. Every package is sized at the published npm version shown in its Packages cell.

Scroll Performance

Every grid receives the identical mouse-wheel input. Each grid's scroll and virtualization model translates that input into a different distance (custom scrollbars and dampened virtual-scroll wheel handling rescale the deltas), so the Rows Traversed column shows how many rows each grid actually covered during the measured pass.

Initial Render

Sort/Filter Performance

Memory Usage

Notes

• gp-grid: Above ~312,000 rows gp-grid caps its DOM scroll container at 10,000,000px, compresses the scroll space, and dampens wheel deltas before applying them, so the shared wheel input traverses fewer rows than on the natively-scrolling grids (see Rows Traversed). Below that threshold it scrolls natively via the wheel like the other grids. Its scroll delta is reported in logical (content) pixels.
• Smart.Grid: Uses Smart.Grid virtualDataSource; sort/filter processing is performed by the benchmark adapter over the full in-memory dataset, then Smart.Grid renders the requested virtual window. Smart.Grid exposes no configurable row overscan, so the shared overscan setting does not apply to it. Its custom scrollbar rescales mouse-wheel input to fixed line steps rather than the event's delta, so under the shared wheel input it traverses a different number of rows than the natively-scrolling grids (see Rows Traversed).
• TanStack Table: TanStack Table is headless: it supplies the sort/filter/row models and, with @tanstack/react-virtual, the row virtualization, but the row and cell DOM is authored by this benchmark. Its render and scroll numbers therefore reflect the benchmark's own markup, not a shipped grid component.

Reproduce

Clone gp-grid, then from the benchmarks/ directory:

pnpm install
pnpm bench

Optionally override the defaults with environment variables before pnpm bench:

• BENCH_ROW_COUNTS — comma-separated row counts (default 1000000)
• BENCH_ITERATIONS — iterations per grid (default 5)
• BENCH_RUN_ID — a label for the run's results directory