29 مستودعات
Efficiently rendering only the visible portion of a large list to maintain performance.
Distinct from Dynamic List Rendering: Specifically targets performance for high-volume data via dynamic item creation, whereas dynamic list rendering often refers to reactive updates.
Explore 29 awesome GitHub repositories matching user interface & experience · Virtualized List Rendering. Refine with filters or upvote what's useful.
This project is a collection of official plugin packages and a native integration library designed to provide a consistent interface for accessing hardware and software functionality across different mobile and desktop platforms. It serves as a native platform bridge, enabling cross-platform applications to invoke native code and manage operating system dependencies. The project utilizes a federated plugin architecture, splitting plugins into common interfaces and separate platform implementations to allow for independent development and extension. It further supports native integration throu
Creates list items dynamically as they scroll into view to maintain performance with high volumes of data.
mui is a mobile UI component framework and native-like web UI kit designed for building high-performance mobile web interfaces. It functions as a mobile web performance framework and gesture-based interface library to eliminate browser lag and mimic the behaviors and animations of native mobile applications. The framework focuses on implementing common mobile UX patterns, including pull-to-refresh functionality, swipe-to-action menus, and sliding side navigation. It provides specialized tools for gesture-driven interface development to ensure an immediate visual response to touch interactions
Optimizes high-volume lists by rendering only the visible portion of the dataset.
tiny-rdm is a Redis database manager and GUI client that provides a visual interface for performing CRUD operations on strings, hashes, lists, sets, and streams. It functions as a comprehensive administration tool, acting as a performance monitor, a pub/sub client, and a web dashboard for monitoring Redis activity. The project distinguishes itself through advanced data visualization and debugging capabilities, including the ability to organize keys into a hierarchical tree structure using custom delimiters. It supports the decoding and decompression of stored values through built-in methods o
Efficiently renders only the visible portion of massive key lists to maintain interface performance.
vue-awesome-swiper is a Vue.js component wrapper for the Swiper library, providing a declarative interface for creating touch-enabled carousels. It serves as a virtualized slider component that can render only visible slides to maintain performance when handling large datasets. The project distinguishes itself through high-performance rendering and a wide array of visual effects, including 3D transitions, parallax movements, and image zoom capabilities. It also supports the synchronization of multiple slider instances and provides accessibility features such as ARIA roles and focus-scrolling
Uses virtualization to render only visible slides, ensuring high performance with large datasets.
Pragmatic Drag and Drop is a TypeScript library that provides a complete system for implementing drag and drop interactions in web applications. It handles the full lifecycle of drag operations, from registering drop targets and monitoring drag events to managing cleanup functions, all through a structured adapter-based approach. The library supports a wide range of data manipulation patterns, including reordering items within lists, tables, trees, virtual lists, and side navigation, as well as moving items between lists and across columns in a board layout. It also enables swapping items in
Supports reordering items within a virtualized list via drag-and-drop.
Bootstrap Table is a jQuery plugin for rendering interactive data grids with sorting, pagination, and filtering. It features a remote data integration system for fetching and synchronizing content from JSON endpoints using AJAX and server-side processing. The project includes a styling layer that adapts markup to work with various CSS frameworks, such as Bootstrap, Semantic UI, Bulma, and Material Design. It provides specialized rendering modes, including a hierarchical tree grid for parent-child row relationships and a responsive card-view table that transforms grids into mobile-friendly lay
Uses a virtualized renderer to display only visible rows, ensuring high performance and low memory usage.
This project is a cross-platform mobile carousel component for creating swipeable image and content sliders. It functions as a virtualized list component that maintains performance by removing off-screen elements and utilizes a native-driver animation library to map scroll offsets to style properties on the native thread for lag-free transitions. The library provides a parallax image gallery capable of shifting images relative to scroll progress to create a sense of depth. It also features a layout system that supports right-to-left orientations for languages such as Arabic and Hebrew. Capab
Employs virtualized list rendering to maintain performance by removing off-screen elements.
Vue Native is a framework that compiles Vue.js single-file components into React Native primitives, enabling developers to build native iOS and Android applications using Vue syntax. At its core, it provides a build-time compiler that transforms Vue components into React components, while hooking Vue's dependency-tracking reactivity system into React's component lifecycle to trigger re-renders when observed data changes. The framework wraps React Native's native module bridge so Vue components can access device APIs through Vue's reactivity system, and maps Vue's component syntax to React Nat
Ships a performant flat list component with pull-to-refresh and scroll loading.
This project is a technical study resource and interview preparation guide focused on the React library. It provides a comprehensive frontend interview question bank and concept references designed to help developers master core library primitives and prepare for professional job interviews. The resource covers detailed explanations of React's technical architecture, including state management patterns, performance optimization strategies, and component design. It serves as a knowledge assessment tool for developers to test their understanding of modern frontend engineering through a structur
Discusses virtualization and pagination strategies for efficiently rendering massive lists.
nativescript-vue is a framework for building native iOS and Android applications using Vue components and a reactive state system. It functions as a cross-platform mobile UI library that renders platform-specific views instead of web views, utilizing a native mobile application bridge to connect Vue logic to NativeScript APIs for direct access to mobile hardware and OS features. The framework employs a reactive mobile component system to create high-performance screens and dynamic lists with automatic state updates. This architecture allows for the development of native mobile applications fr
Provides a high-performance system for rendering scrollable data collections using virtualized native lists.
React Virtuoso is a React component library for rendering large datasets efficiently through virtualized lists, grids, tables, and chat interfaces. It automatically measures variable-height items at runtime, computes accurate scroll offsets without requiring fixed sizes, and renders only the items within the visible viewport plus a configurable buffer zone. The library manages scroll position through a state machine that tracks direction, position, and anchor items to handle auto-scroll, sticky headers, and bidirectional loading. The library distinguishes itself with specialized components fo
Renders large lists efficiently by displaying only items in the visible viewport.
هذا المشروع عبارة عن مكون جدول بيانات React مدمج مع shadcn/ui. يوفر مجموعة من شبكات البيانات الجدولية التي تدعم الفرز، والتصفية، والترقيم. يتضمن التنفيذ شبكة بيانات افتراضية وجدول تمرير لانهائي، مما يسمح بعرض مجموعات البيانات الكبيرة عن طريق تحميل السجلات تدريجياً أو عرض العناصر المرئية فقط في إطار العرض. يعمل أيضاً كجدول تعاوني في الوقت الفعلي، مما يتيح لعدة مستخدمين إدارة وتحرير مجموعات البيانات المشتركة في وقت واحد. يغطي المكون إدارة البيانات التفاعلية وتصور البيانات المعقدة. يشمل ذلك القدرة على إدارة اختيار الصفوف من خلال أشرطة الإجراءات السياقية واستخدام التصفية القائمة على تعريف الأعمدة لتنظيم السجلات.
Maintains high performance by rendering only the rows currently visible in the viewport.
Avalon is a client-side MVVM JavaScript framework that binds model data to DOM elements and automatically updates views when state changes. It functions as a component-based UI framework, encapsulating markup, logic, and styles into reusable custom components that can be composed across pages, while also serving as a virtual DOM diffing engine that computes minimal DOM updates by comparing lightweight in-memory view tree snapshots. The framework distinguishes itself through a template directive compiler that transforms declarative HTML attributes like ms-repeat and ms-if into executable view
Renders big tables or lists without blocking the browser during page load, avoiding white-screen pauses.
Recyclerlistview هو مكون قائمة افتراضي عبر المنصات لـ React Native والويب. يعمل كمكتبة واجهة مستخدم لإعادة تدوير الخلايا التي تعيد استخدام مجموعة صغيرة من المكونات خارج الشاشة عن طريق تحديث بياناتها بدلاً من إنشاء طرق عرض جديدة لكل عنصر. يتضمن إطار العمل محرك تخطيط شبكي ديناميكي يدعم الشبكات المتداخلة وارتفاعات العناصر المتغيرة، مما يسمح بالتبديل الفوري بين أوضاع عرض القائمة والشبكة. توفر المكتبة قدرات لإدارة التمرير الافتراضي، بما في ذلك تتبع القابلية للعرض، والرؤوس الثابتة، واستعادة موضع التمرير. كما تدعم تنفيذ التمرير اللانهائي والقدرة على تخصيص رسوم العناصر المتحركة أثناء تغييرات الارتفاع أو الموضع.
Minimizes memory overhead by recycling non-visible views during infinite scrolling of large datasets.
هذا المستودع عبارة عن مجموعة من التطبيقات والمعارض المرجعية التي توضح أفضل الممارسات لنظام Android View. يوفر مجموعة من الأمثلة العملية لبناء واجهات المستخدم، بما في ذلك معرض المكونات وأدلة التنفيذ للتخطيطات، وأداء القائمة، وتصميم الحركة. يتميز المشروع بعينات مفصلة لتنسيق رسوم متحركة التخطيط وتأثيرات الانتقال. يتضمن عروضاً توضيحية متخصصة لرسوم متحركة معقدة للحركة باستخدام الإطارات الرئيسية والاستيفاء، بالإضافة إلى أداة تصور لمنحنيات استيفاء الرسوم المتحركة لتحديد معلمات الحركة. يغطي الكود المصدري مجالات قدرات واسعة بما في ذلك إدارة القائمة عالية الأداء مع إعادة تدوير العرض والتحديثات التفاضلية، والتنقل المرقم مع مزامنة علامات التبويب، وقابلية تكيف الواجهة لأوضاع النوافذ المتعددة والشاشة المقسمة. كما يتضمن عينات لتخطيطات البطاقات، ومحتوى الويب المضمن، واختبار واجهة المستخدم الآلي لانتقالات الصفحة.
Renders large scrolling lists using view recycling to maintain high performance.
هذا المشروع عبارة عن قالب إداري ومجموعة أدوات واجهة مستخدم تعتمد على React مصممة لبناء لوحات المعلومات. يوفر مجموعة شاملة من التخطيطات المنسقة مسبقاً، ومكتبة مكونات يمكن الوصول إليها، وإطار عمل واجهة مستخدم يعتمد على Sass لإنشاء واجهات إدارية. تم هيكلة القالب خصيصاً كمشروع محسن للذكاء الاصطناعي، باستخدام أنماط ترميز وتنظيم مصممة لمساعدة مساعدي الذكاء الاصطناعي في إنشاء كود React متسق وجاهز للإنتاج. يتميز بنظام تنسيق مرن باستخدام متغيرات Sass وخصائص CSS المخصصة لدعم سمات فاتحة وداكنة قابلة للتخصيص. تغطي المجموعة مجموعة واسعة من قدرات الواجهة، بما في ذلك أدوات تصور البيانات، والجداول التفاعلية مع الفرز والترقيم، وعناصر النماذج المعقدة مثل المعالجات متعددة الخطوات. يتضمن أنظمة تنقل عالية المستوى مثل الأشرطة الجانبية ومسارات التنقل، بالإضافة إلى مكونات هيكلية مثل الشبكات المستجيبة، ومربعات الحوار المشروطة، وواجهات التقويم التي يمكن الوصول إليها.
Optimizes the display of large datasets by rendering only the visible subset of items during scrolling.
vue-virtual-scroll-list هو تنفيذ قائمة افتراضية لتطبيقات Vue. يوفر مكوناً يعرض فقط العناصر المرئية لمجموعة بيانات كبيرة للحفاظ على الأداء العالي وتقليل عدد عناصر DOM النشطة. يعمل المشروع كعارض قائمة عالي الأداء ومدير منفذ عرض ديناميكي. يحسب أبعاد القائمة وإزاحات التمرير في الوقت الفعلي لعرض آلاف إدخالات البيانات دون تدهور استخدام ذاكرة المتصفح أو الأداء. يتضمن النظام تحكماً برمجياً في التمرير للانتقال إلى فهارس عناصر محددة أو إزاحات بكسل. كما يوفر أدوات للاستعلام عن أبعاد القائمة، وحجم منفذ العرض، وقياسات العناصر الفردية لإدارة تباعد التخطيط.
Implements a virtualized rendering strategy that displays only the visible portion of a large list.
This project is a reference guide and technical resource for building user interfaces with the SwiftUI framework. It provides a comprehensive collection of code examples, documentation, and a component library of reusable view implementations and layout patterns. The resource includes a compatibility map that links modern declarative views to their equivalent imperative counterparts in the UIKit framework. This documentation assists with the migration from UIKit to SwiftUI by providing guidance on wrapping legacy view controllers and view subclasses within a declarative hierarchy. The guide
Utilizes lazy loading for large collections to maintain high frame rates and stable memory usage.
Fixed-data-table is a React component library designed for rendering large datasets within structured, scrollable grid interfaces. It functions as a virtualized table, optimizing performance by rendering only the rows currently visible within the viewport. The library distinguishes itself through its focus on maintaining context during navigation, utilizing fixed-header layouts and synchronized scroll state management. It employs index-based data access to map information to specific grid coordinates, allowing for modular cell customization and flexible column configuration. The component su
Enables efficient rendering of massive datasets in a scrollable view while maintaining context with fixed headers.
هذا المشروع عبارة عن مرجع تقني ودليل لتحسين أداء تطبيقات Angular. يوفر قائمة مرجعية شاملة لتحسين السرعة والكفاءة من خلال التركيز على تحسين الحزم (bundle)، وأفضل ممارسات العرض، وتنفيذ وقت التشغيل. يغطي الدليل مجموعة واسعة من الميزات بما في ذلك تنفيذ استراتيجيات تطبيقات الويب التقدمية (PWA) من خلال عمال الخدمة (service workers) والتخزين المؤقت دون اتصال. كما يفصل طرق تحسين أوقات التحميل المتصورة باستخدام العرض من جانب الخادم (SSR) وأغلفة التطبيقات. يوفر المستودع توجيهاً حول مجالات إمكانيات أوسع مثل ضبط اكتشاف التغيير، واستخدام عمال الويب (web workers) لتفريغ الحسابات الثقيلة، وإدارة DOM عبر التمرير الافتراضي. كما يغطي تقليل حجم الحزمة من خلال التخلص من الكود غير المستخدم (tree-shaking)، والضغط، وتقسيم الوحدات بالتحميل الكسول.
Improves DOM performance using tracking functions and virtual scrolling to limit rendered elements.