Awesome GitHub RepositoriesReactive Components

Reactpy is a Python web component framework and server-side UI library used to build interactive web interfaces. It allows for the creation of structured web layouts and visual logic within Python, removing the requirement to write client-side JavaScript. The framework utilizes a component-based model with reactive state management, where the user interface automatically updates in response to changes in the underlying Python state. It employs a virtual-DOM diffing process and WebSocket-based syncing to push real-time updates from the server to the browser. The system functions as an integra

Ripple is a full-stack TypeScript web framework and reactive UI library used for building interfaces with server-side rendering. It organizes user interfaces into a hierarchy of reusable, scoped components with built-in state management and client-side hydration. The framework is distinguished by its fine-grained reactivity, which updates specific DOM elements without requiring full component re-renders. It integrates server-side logic and client-side components within a single TypeScript codebase, enabling a unified full-stack development workflow. The system covers a broad range of capabil

Reagent هو إطار عمل لبناء واجهات مستخدم الويب باستخدام ClojureScript و React.js. يتيح نهج البرمجة الوظيفية لتصميم واجهة المستخدم التصريحية، حيث يتم تعريف هياكل HTML وتسلسلات هرمية للمكونات باستخدام بناء جملة Hiccup القائم على المتجهات بدلاً من JSX. يتميز المشروع من خلال نظام إدارة حالة تفاعلي يعتمد على الذرات (atoms). يتتبع المكونات التي تقوم بإلغاء مرجعية ذرات حالة معينة لتشغيل إعادة العرض التلقائي ويوفر مؤشرات حالة لعزل التحديثات إلى مسارات معينة لذرة حالة أكبر. كما يتضمن أدوات لتغليف مكونات JavaScript الأصلية ومكتبات الطرف الثالث لضمان بقائها متوافقة مع دورة العرض الوظيفية. يغطي إطار العمل مجموعة واسعة من القدرات، بما في ذلك التوفيق بين DOM الافتراضي، وإدارة دورة الحياة للآثار الجانبية والتنظيف، وتحسين أداء العرض من خلال تجميع التحديثات وتخزين الحسابات مؤقتاً (memoization). كما يوفر أدوات لعرض جانب الخادم لسلاسل HTML الثابتة، ومشاركة الحالة العالمية عبر السياق، وأساسيات الأمان لتعقيم محتوى HTML.

Effector is a reactive state management library designed for building complex, event-driven applications. It functions as a data flow engine that models application logic as a directed acyclic graph, ensuring that state updates propagate automatically through interconnected nodes. By utilizing atomic state updates and declarative unit composition, the library maintains data consistency and provides a predictable execution model for managing application state. The project distinguishes itself through its framework-agnostic architecture, which decouples business logic from user interface implem

Lit-element هو إطار عمل للعناصر المخصصة ومكتبة واجهة مستخدم تفاعلية توفر فئة أساسية لإنشاء عناصر HTML قياسية. صُمم لبناء مكونات ويب تقوم بتحديث حالتها المرئية تلقائياً عند تغير الخصائص أو البيانات الداخلية. يمكن المشروع من تطوير مكونات مغلفة باستخدام shadow root لعزل الأنماط والهيكل. ويستخدم قوالب JavaScript الحرفية لعرض قوالب تعريفية دون الحاجة إلى خطوة تجميع. تغطي المكتبة إدارة الحالة من خلال تتبع الخصائص التفاعلية ومزامنة خصائص فئة JavaScript مع سمات HTML. كما تتضمن قدرات لتحديد نطاق محددات CSS وإدارة دورات العرض غير المتزامنة للتعامل مع تحديثات الواجهة.

Signals is a reactive state management library and fine-grained reactivity engine. It functions as a dependency-tracking state manager that maps relationships between values to ensure derived data and user interface elements remain synchronized. The library distinguishes itself through direct-to-node DOM binding, which allows state to update specific text nodes in the browser without triggering a full component render cycle. It employs a runtime dependency graph and atomic batching to group multiple state modifications into single notification cycles, reducing redundant executions. The syste

Hyperscript is a DOM manipulation library and HTML scripting language that functions as a logic engine and reactive UI framework. It allows for the definition of interactive behavior and client-side logic directly within HTML attributes. The system distinguishes itself through declarative web scripting and in-HTML interactive behavior, which removes the requirement for separate JavaScript files to manage element states. It utilizes a specialized syntax for data processing, employing pipe operators to filter, sort, and convert data collections within the browser. The framework provides capabi

هذا المشروع عبارة عن قالب لوحة تحكم إدارية شامل مبني على Bootstrap 5. يوفر مكتبة معيارية من مكونات الواجهة المصممة مسبقاً، وتخطيطات الصفحات، وعناصر النماذج التي تهدف إلى تسريع بناء تطبيقات الويب المتجاوبة. صُمم إطار العمل ليكون خفيف الوزن، حيث يستخدم برمجة المتصفح الأصلية لجميع السلوكيات التفاعلية للقضاء على التبعيات على المكتبات الخارجية الثقيلة. يتميز القالب بالتركيز على الأداء والتخصيص. يتضمن خط أنابيب أصول قائماً على مشغل المهام (task-runner) يقوم بأتمتة تجميع وتصغير وتغليف ملفات المصدر، مما يضمن أصولاً جاهزة للإنتاج ومحسنة. يمكن للمطورين الحفاظ على هوية العلامة التجارية والتصميم المتسقة عن طريق تعديل ملفات التكوين المركزية، التي تستفيد من متغيرات المعالج المسبق (preprocessor) والمزيج (mixins) لإنشاء فئات أدوات مخصصة وأوراق أنماط. بعيداً عن مكونات واجهة المستخدم الأساسية، يتضمن المشروع مجموعة من الوحدات الوظيفية لإدارة مصادقة المستخدم، بما في ذلك سير عمل التسجيل وتسجيل الدخول واستعادة كلمة المرور. كما يوفر أدوات متكاملة لتصور البيانات، وإدارة البيانات الجدولية، والجدولة التفاعلية، إلى جانب قوالب جاهزة لصفحات التطبيق الشائعة مثل شاشات الخطأ وإدارة الملف الشخصي. يوفر المستودع كلاً من ملفات المصدر غير المصغرة وحزم الإنتاج المحسنة، مما يسمح بالنشر المباشر دون الحاجة إلى بيئات تشغيل معقدة من جانب الخادم.

Observer-util هي مكتبة لإدارة الحالة التفاعلية تستفيد من وكلاء ES6 (proxies) لأتمتة تتبع التبعية والمزامنة بين البيانات ومنطق التطبيق. من خلال تغليف هياكل البيانات البسيطة في وكلاء شفافين، تراقب المكتبة الوصول إلى الخصائص والطفرات لتشغيل الوظائف المرتبطة تلقائياً كلما تغيرت الحالة الأساسية. تتميز المكتبة بتحكمها الدقيق في دورة الحياة التفاعلية وتدفق التنفيذ. وتوفر آليات لفصل اكتشاف تغيير البيانات عن تنفيذ التفاعل، مما يسمح للمطورين بتنفيذ منطق جدولة مخصص للتحديثات. علاوة على ذلك، فهي تدمج إدارة مرجعية آمنة للذاكرة، باستخدام مجموعات ضعيفة (weak collections) لضمان توقف تتبع التبعية وتنظيف المراقبين عندما لا يعودون نشطين. بعيداً عن محركها التفاعلي الأساسي، تقدم المكتبة مجموعة من أدوات التشخيص والإدارة. وتشمل هذه الأدوات فحص الحالة التفاعلية للكائنات، والوصول إلى البيانات الخام، وإدارة دورة حياة الهياكل القابلة للمراقبة يدوياً. تدعم هذه القدرات إنشاء طبقات بيانات يمكن التنبؤ بها ومزامنة عناصر واجهة المستخدم مع حالة التطبيق.