# rowsncolumns/grid **Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/rowsncolumns-grid).** 633 stars · 87 forks · TypeScript ## Links - GitHub: https://github.com/rowsncolumns/grid - Homepage: https://rowsncolumns.app - awesome-repositories: https://awesome-repositories.com/repository/rowsncolumns-grid.md ## Topics `canvas` `datagrid` `declarative` `reactjs` `table` ## Description This project is a high-performance data grid component designed for React applications. It provides a declarative framework for rendering large-scale datasets and complex tabular structures by utilizing a canvas-based drawing engine instead of traditional document object model nodes. The library distinguishes itself through a windowed virtualization engine that maintains constant memory usage by rendering only the visible portion of the grid. It translates pointer interactions into specific cell references through coordinate-based mapping and supports the injection of external application state and themes directly into the canvas environment to ensure consistent data access across custom cell renderers. The grid supports sophisticated layout configurations, including frozen rows and columns, merged cells, and resizable headers. It also provides tools for organizing information into hierarchical, tree-based structures to represent nested data relationships. The library is distributed as a set of React primitives that integrate into existing web applications to manage scroll state and layout reconciliation for complex data interfaces. ## Tags ### User Interface & Experience - [Data Grid Components](https://awesome-repositories.com/f/user-interface-experience/text-rendering/dom-based-rendering/grid-layout-rendering/data-grid-components.md) — Ships a high-performance virtualized data grid component designed for React applications. - [High Performance Table Rendering](https://awesome-repositories.com/f/user-interface-experience/high-performance-table-rendering.md) — Renders massive datasets smoothly in the browser using efficient virtualized canvas techniques. - [Viewport-Based Virtualization](https://awesome-repositories.com/f/user-interface-experience/viewport-based-virtualization.md) — Optimizes memory usage by rendering only the visible portion of the grid through a windowed virtualization engine. - [Virtualized Data Rendering](https://awesome-repositories.com/f/user-interface-experience/virtualized-data-rendering.md) — Maintains high performance with massive datasets by rendering only the visible portion of the grid during scrolling. ([source](https://github.com/rowsncolumns/grid/tree/master/packages/grid)) - [Virtualized Data Tables](https://awesome-repositories.com/f/user-interface-experience/virtualized-data-tables.md) — Optimizes rendering performance by displaying only visible cells to handle massive data volumes efficiently. - [React Components](https://awesome-repositories.com/f/user-interface-experience/component-utilities/ui-frameworks/component-libraries/react-components.md) — Integrates as a set of React primitives for embedding high-performance grids into existing web applications. - [Declarative UI Frameworks](https://awesome-repositories.com/f/user-interface-experience/component-utilities/ui-frameworks/rendering-models/declarative-frameworks/declarative-ui-frameworks.md) — Provides a declarative framework for defining complex grid structures and hierarchical data relationships. - [Context-Based Theme Injection](https://awesome-repositories.com/f/user-interface-experience/context-based-theme-injection.md) — Injects application state and themes into the canvas environment using React context providers for consistent data access. - [Hierarchical Data Displays](https://awesome-repositories.com/f/user-interface-experience/data-display-components/hierarchical-data-displays.md) — Provides tools for displaying and navigating nested or grouped information within a tree-based tabular structure. - [Frozen Grid Elements](https://awesome-repositories.com/f/user-interface-experience/grid-layouts/frozen-grid-elements.md) — Supports complex grid configurations including frozen rows, columns, and resizable headers for professional tabular interfaces. ([source](https://github.com/rowsncolumns/grid/tree/master/packages/grid)) - [Programmatic Grid Data Synchronization](https://awesome-repositories.com/f/user-interface-experience/programmatic-grid-data-synchronization.md) — Synchronizes scroll positions and grid state with application logic to maintain interface alignment during user interactions. ([source](https://github.com/rowsncolumns/grid/tree/master/packages/grid)) - [Complex Grid Layouts](https://awesome-repositories.com/f/user-interface-experience/view-customizations/custom-cell-design/complex-grid-layouts.md) — Enables the development of sophisticated data grids with custom layouts, merged cells, and advanced header configurations. ### Data & Databases - [Hierarchical Data Structures](https://awesome-repositories.com/f/data-databases/hierarchical-data-structures.md) — Organizes tabular information into tree-based layouts to represent nested relationships and grouped data sets. ([source](https://github.com/rowsncolumns/grid/tree/master/packages/grid)) ### DevOps & Infrastructure - [Declarative Reconciliation Engines](https://awesome-repositories.com/f/devops-infrastructure/declarative-reconciliation-engines.md) — Automatically reconciles grid layout configurations with internal coordinate systems whenever the underlying data structure changes. ### Graphics & Multimedia - [Immediate Mode Canvas Renderers](https://awesome-repositories.com/f/graphics-multimedia/graphics-engines-rendering/rendering/engines/canvas-vector-graphics/immediate-mode-canvas-renderers.md) — Provides a high-performance rendering engine that draws grid elements directly onto a canvas using immediate-mode commands. - [Grid Coordinate Mapping](https://awesome-repositories.com/f/graphics-multimedia/visualization-mapping/visualization-frameworks/coordinate-systems/page-coordinate-mapping/grid-coordinate-mapping.md) — Maps screen coordinates to grid cells to enable precise interaction handling within the virtualized canvas layout.