Introduction
A high-performance TypeScript data grid with virtual scrolling
gp-grid
A high-performance TypeScript data grid built on three core principles:
-
Slot-Based Virtual Scrolling - DOM elements are recycled rather than created/destroyed, maintaining consistent performance regardless of dataset size.
-
Instruction-Based Architecture - The core emits declarative instructions that framework adapters interpret, keeping rendering logic framework-agnostic.
-
DataSource Abstraction - Clean separation between data operations and UI, supporting both client-side and server-side data handling.
Features
- Virtual scrolling with slot recycling
- Column dragging and reordering
- Row dragging and reordering
- Column resizing with min/max constraints
- Cell selection with range and multi-select
- Multi-column sorting
- Column filtering with debounced input
- Cell editing with fill handle
- Keyboard navigation
- Custom cell/edit/header renderers
- Dark mode support
- Full TypeScript support
- Zero external dependencies
Packages
| Package | Description |
|---|---|
@gp-grid/core | Framework-agnostic core logic |
@gp-grid/react | Official React bindings |
@gp-grid/vue | Official Vue 3 bindings |