13 Repos
Mounting only visible subsets of large datasets to optimize rendering performance.
Distinguishing note: Focuses on the virtualization technique rather than general UI component libraries.
Explore 13 awesome GitHub repositories matching user interface & experience · Viewport-Based Virtualization. Refine with filters or upvote what's useful.
react-virtualized is a library of components for rendering massive lists and tables by drawing only the elements visible in the viewport. It provides specialized layout managers including a windowed grid component and a dynamic height list manager. The project includes a masonry layout engine for packing items of varying heights and widths, as well as an infinite scroll interface for incrementally fetching and appending data. The library covers a broad range of virtualization capabilities, including frozen grid elements, reverse list rendering, and synchronized viewport scrolling. It also su
Calculates the visible slice of a dataset to render only items within the current viewport.
Calibre is a comprehensive suite for digital library management, serving as a centralized hub for organizing, converting, and editing e-book collections. It functions as a multi-purpose platform that combines a relational database for metadata tracking with a powerful processing engine capable of transforming document formats and restructuring internal markup. Beyond local management, the software acts as a content server, enabling users to host their libraries over a network for remote access and reading via standard web browsers. The project distinguishes itself through its deep extensibili
Filters master databases into focused subsets based on saved search criteria to simplify library navigation.
React-window is a frontend performance optimization library designed to render large datasets in React applications. It implements virtualization techniques to manage long lists and complex tabular data by dynamically mounting and unmounting elements based on the current viewport. By limiting the number of active document nodes, the library maintains interface responsiveness when handling thousands of data entries. The library distinguishes itself through a focus on efficient layout calculations and scroll-driven reconciliation. It uses absolute positioning and predefined dimensions to determ
Mounts only visible subsets of large datasets to optimize rendering performance and keep DOM node counts constant.
This library is a headless virtualization engine designed to optimize performance for large-scale list and grid rendering in Vue applications. By mounting only the elements currently visible within the viewport, it minimizes browser operations and memory usage, allowing interfaces to remain responsive even when handling massive datasets. The engine distinguishes itself through a headless layout abstraction that decouples virtualization logic from specific markup, enabling the creation of custom interfaces without enforcing rigid container styles. It features automatic, dynamic size calculatio
Mounts and unmounts DOM nodes dynamically based on viewport intersection to minimize memory usage.
GoJS is a JavaScript diagramming library and canvas-based visualization engine used to build interactive flowcharts, organizational charts, and network diagrams. It functions as a data-driven framework that binds JavaScript data models to visual elements, enabling bidirectional synchronization between the underlying data and the graphical representation. The library features a comprehensive graph layout engine capable of automatically arranging nodes into trees, grids, circles, or force-directed layouts. It distinguishes itself through a template-based system for generating visual parts and a
Maintains high performance for large datasets by rendering only elements currently within the visible viewport.
react-data-grid is a high-performance tabular interface for rendering and manipulating large datasets within a React application. It functions as a virtualized data table and editable spreadsheet component that supports hierarchical data grids with expandable and collapsible row groupings. The component maintains performance with massive datasets by rendering only the rows and columns currently visible in the viewport. It provides spreadsheet-like data manipulation, including cell editing and the ability to copy, paste, or drag values between cells. The grid supports advanced layout capabili
Maintains high performance by rendering only the rows and columns currently visible in the viewport.
Tabulator is an interactive data table library and virtual DOM data grid used to create high-performance tables from JSON or arrays. It functions as a hierarchical data viewer and a spreadsheet interface component, capable of rendering thousands of records efficiently through viewport-based virtualization and progressive loading. The library distinguishes itself by providing a full spreadsheet interface mode with multi-sheet management, cell range selection, and bulk copy-paste capabilities. It supports complex data architectures, including nested data field mapping, expandable tree structure
Processes only the rows visible in the current viewport to maintain high performance when handling thousands of records.
Glide Data Grid ist ein virtualisiertes Datengitter für React und TypeScript, das die HTML Canvas API nutzt, um Millionen von Zellen flüssig darzustellen. Es ist als barrierefreie Datentabelle konzipiert, die auch bei der Anzeige und Navigation durch riesige Datensätze hohe Bildraten beibehält. Das Projekt zeichnet sich durch eine Canvas-basierte Rendering-Architektur aus, die Lazy Rendering und eine benutzerdefinierte Zeichen-API verwendet. Dies ermöglicht spezialisierte Zellinhalte und datengesteuertes Styling, das Standard-DOM-Update-Zyklen umgeht, um eine hohe Performance zu gewährleisten. Das Gitter bietet umfassende Layout- und Datenverwaltungsfunktionen, einschließlich Zellzusammenführung, fixierter Spalten, variabler Zeilenhöhen und automatischer Spaltenbreitenberechnung. Es enthält zudem integrierte Unterstützung für Zellbearbeitung, Elementauswahl und Datensuche innerhalb des Gitters.
Uses viewport-based virtualization to render only the visible subset of cells from massive datasets.
leap.nvim is a Neovim motion plugin and text navigation tool designed for keyboard-driven cursor positioning. It enables users to move the cursor to any specific character visible on the screen using short keystroke sequences. The plugin identifies target characters within the current viewport and assigns disambiguating labels to multiple matches, allowing for precise cursor relocation without the use of a mouse.
Scans only the visible viewport area to identify candidate characters for jumping.
Attaches the virtualizer directly to the window’s scroll event, treating the document body as the scrollable viewport.
React Base Table ist eine Bibliothek wiederverwendbarer Interface-Komponenten für den Aufbau komplexer, responsiver Datengitter innerhalb von Webanwendungen. Sie bietet ein leistungsstarkes Fundament für das Rendern großer Datensätze durch die Nutzung fensterbasierter Zeilen-Virtualisierung, die sicherstellt, dass die Benutzeroberfläche auch bei der Anzeige umfangreicher Datensammlungen reaktionsfähig bleibt. Die Bibliothek zeichnet sich durch flexible Layout- und Navigationsfunktionen aus, einschließlich der Unterstützung hierarchischer Datenstrukturen, die als erweiterbare Baumzeilen gerendert werden können. Sie ermöglicht eine präzise Kontrolle über die Tabellengeometrie durch proportionale Spaltengrößenanpassung und automatisches Container-Tracking, während Benutzer gleichzeitig spezifische Spalten an den Viewport-Rändern fixieren können, um die Sichtbarkeit während des horizontalen Scrollens zu erhalten. Entwickler können hochgradig maßgeschneiderte Datenanzeigen erstellen, indem sie benutzerdefinierte Komponenten direkt in Tabellenzellen injizieren und Styling-Overrides anwenden, um spezifische Designanforderungen zu erfüllen. Das System passt sich automatisch an Änderungen der Größe des übergeordneten Containers an und stellt sicher, dass das Tabellenlayout über verschiedene Bildschirmdimensionen und Interface-Konfigurationen hinweg konsistent bleibt.
Renders only the visible subset of data rows by calculating scroll offsets to maintain high performance.
Diese Bibliothek ist eine React-Komponente für das Rendering von Hochleistungs-Datengittern. Sie bietet ein strukturiertes Framework zur Anzeige großer Datensätze durch die Nutzung von Fenster-basierter Zeilen-Virtualisierung, die sicherstellt, dass nur der sichtbare Teil der Daten im Document Object Model (DOM) gerendert wird. Die Komponente zeichnet sich durch fortschrittliche Layout- und Navigationsfunktionen aus, einschließlich nativer Unterstützung für Sticky-Header und Spalten, die beim Scrollen verankert bleiben. Entwickler können imperative Kontrolle über den Tabellen-Viewport ausüben, um zu bestimmten Indizes oder Pixel-Offsets zu navigieren, während komplexe Grid-Zustände wie Spaltensichtbarkeit, Sortierung und Zeilenerweiterung über eine zentrale Konfiguration verwaltet werden. Die Bibliothek unterstützt eine breite Palette interaktiver Funktionen, einschließlich benutzerdefiniertem Zell-Rendering, Spalten-Pinning und der Möglichkeit, Zusammenfassungszeilen für aggregierte Daten anzuhängen. Sie verarbeitet dichte Informationssätze durch flexible Spaltenausrichtung, Breitensteuerung und Textkürzung, was die Erstellung interaktiver Tabellen ermöglicht, die auf Benutzerereignisse wie Klicks und Hover reagieren.
Implements window-based row virtualization to render only visible data, ensuring high performance with large datasets.
Dieses Projekt ist eine hochperformante Data-Grid-Komponente für React-Anwendungen. Es bietet ein deklaratives Framework zum Rendern umfangreicher Datensätze und komplexer tabellarischer Strukturen, indem es eine Canvas-basierte Rendering-Engine anstelle herkömmlicher DOM-Knoten verwendet. Die Bibliothek zeichnet sich durch eine Windowed-Virtualization-Engine aus, die den Speicherverbrauch konstant hält, indem nur der sichtbare Teil des Grids gerendert wird. Sie übersetzt Pointer-Interaktionen durch koordinatenbasiertes Mapping in spezifische Zellreferenzen und unterstützt die Injektion von externem Applikations-State und Themes direkt in die Canvas-Umgebung, um einen konsistenten Datenzugriff über benutzerdefinierte Zell-Renderer hinweg zu gewährleisten. Das Grid unterstützt komplexe Layout-Konfigurationen, einschließlich fixierter Zeilen und Spalten, verbundener Zellen und in der Größe anpassbarer Header. Zudem bietet es Tools zur Organisation von Informationen in hierarchischen, baumbasierten Strukturen, um verschachtelte Datenbeziehungen abzubilden. Die Bibliothek wird als Set von React-Primitives bereitgestellt, die sich in bestehende Webanwendungen integrieren lassen, um den Scroll-Status und das Layout-Reconciliation für komplexe Daten-Interfaces zu verwalten.
Optimizes memory usage by rendering only the visible portion of the grid through a windowed virtualization engine.