9 repositorios
UI components that automatically synchronize their visual state with underlying data changes.
Distinct from User Interface Components: Focuses on the reactivity of the components rather than just the reusable layout patterns
Explore 9 awesome GitHub repositories matching user interface & experience · Reactive Components. Refine with filters or upvote what's useful.
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
Enables the creation of independent, state-managed components that drive interactive user interfaces.
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
Provides a modular architecture for creating reusable UI elements that automatically synchronize with data changes.
Reagent es un framework para construir interfaces de usuario web utilizando ClojureScript y React.js. Permite un enfoque de programación funcional para el diseño de UI declarativa, donde las estructuras HTML y las jerarquías de componentes se definen utilizando sintaxis Hiccup basada en vectores en lugar de JSX. El proyecto se diferencia a través de un sistema de gestión de estado reactivo basado en átomos. Rastrea qué componentes desreferencian átomos de estado específicos para activar re-renderizados automáticos y proporciona cursores de estado para aislar actualizaciones a rutas específicas de un átomo de estado más grande. También incluye utilidades para envolver componentes nativos de JavaScript y bibliotecas de terceros para asegurar que permanezcan compatibles con el ciclo de renderizado funcional. El framework cubre una amplia gama de capacidades, incluyendo la reconciliación del DOM virtual, la gestión del ciclo de vida para efectos secundarios y limpieza, y la optimización del rendimiento de renderizado mediante el procesamiento por lotes de actualizaciones y la memorización de cálculos. También proporciona herramientas para el renderizado del lado del servidor de cadenas HTML estáticas, intercambio de estado global a través de contexto y primitivas de seguridad para la sanitización de contenido HTML.
Provides UI components that automatically synchronize their visual state with underlying data atoms.
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
Binds reactive state units directly to UI components to ensure automatic display updates.
Lit-element es un framework de elementos personalizados y una librería de UI reactiva que proporciona una clase base para crear elementos HTML estándar. Está diseñado para construir componentes web que actualizan automáticamente su estado visual cuando cambian las propiedades internas o los datos. El proyecto permite el desarrollo de componentes encapsulados utilizando el shadow root para aislar estilos y estructuras. Utiliza plantillas literales de JavaScript para renderizar plantillas declarativas sin necesidad de un paso de compilación. La librería cubre la gestión del estado mediante el seguimiento de propiedades reactivas y la sincronización de propiedades de clase de JavaScript con atributos HTML. También incluye capacidades para el alcance de selectores CSS y la gestión de ciclos de renderizado asíncronos para manejar las actualizaciones de la interfaz.
Builds custom elements that automatically refresh their visual templates when internal state changes.
Signals es una librería de gestión de estado reactiva y motor de reactividad de grano fino. Funciona como un gestor de estado de seguimiento de dependencias que mapea las relaciones entre valores para asegurar que los datos derivados y los elementos de la interfaz de usuario permanezcan sincronizados. La librería se distingue por su enlace directo al DOM (direct-to-node), lo que permite que el estado actualice nodos de texto específicos en el navegador sin activar un ciclo completo de renderizado de componentes. Emplea un grafo de dependencias en tiempo de ejecución y procesamiento por lotes atómico para agrupar múltiples modificaciones de estado en ciclos de notificación únicos, reduciendo ejecuciones redundantes. El sistema cubre contenedores de estado reactivos, señales calculadas de evaluación perezosa y ejecución de efectos secundarios con lógica de limpieza integrada. También proporciona modelos de estado encapsulados para la gestión del ciclo de vida y herramientas para visualizar cadenas de dependencia y monitorear la propagación del estado. El proyecto está implementado en TypeScript.
Automatically triggers component re-renders when signal values change via runtime hooks or build-time transforms.
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
Supports building custom web components that automatically synchronize their visual state with data changes.
Este proyecto es una plantilla de dashboard administrativo integral construida sobre Bootstrap 5. Proporciona una librería modular de componentes de interfaz pre-diseñados, diseños de página y elementos de formulario destinados a acelerar la construcción de aplicaciones web responsivas. El framework está diseñado para ser ligero, utilizando scripting nativo del navegador para todos los comportamientos interactivos para eliminar dependencias de librerías externas pesadas. La plantilla destaca por un enfoque en el rendimiento y la personalización. Incluye un pipeline de activos basado en un ejecutor de tareas que automatiza la compilación, minificación y empaquetado de archivos fuente, asegurando activos optimizados listos para producción. Los desarrolladores pueden mantener una marca e identidad visual consistentes modificando archivos de configuración centralizados, que aprovechan variables de preprocesador y mixins para generar clases de utilidad y hojas de estilo personalizadas. Más allá de sus componentes de UI centrales, el proyecto incluye un conjunto de módulos funcionales para gestionar la autenticación de usuarios, incluyendo flujos de registro, inicio de sesión y recuperación de contraseñas. También proporciona herramientas integradas para la visualización de datos, gestión de datos tabulares y programación interactiva, junto con plantillas preconstruidas para páginas comunes de aplicaciones como pantallas de error y gestión de perfiles. El repositorio proporciona tanto archivos fuente sin minificar como bundles de producción optimizados, permitiendo el despliegue directo sin requerir entornos de ejecución del lado del servidor complejos.
Integrates reactive components to handle dynamic data updates like notifications and charts without page reloads.
Observer-util es una biblioteca de gestión de estado reactiva que aprovecha los proxies de ES6 para automatizar el seguimiento de dependencias y la sincronización entre los datos y la lógica de la aplicación. Al envolver estructuras de datos simples en proxies transparentes, la biblioteca monitorea el acceso a las propiedades y las mutaciones para activar funciones asociadas automáticamente cada vez que cambia el estado subyacente. La biblioteca se distingue por su control granular sobre el ciclo de vida reactivo y el flujo de ejecución. Proporciona mecanismos para desacoplar la detección de cambios de datos de la ejecución de la reacción, permitiendo a los desarrolladores implementar lógica de programación personalizada para las actualizaciones. Además, incorpora una gestión de referencias segura para la memoria, utilizando colecciones débiles (weak collections) para asegurar que el seguimiento de dependencias se detenga y los observadores se limpien cuando ya no estén activos. Más allá de su motor reactivo central, la biblioteca ofrece un conjunto de utilidades de diagnóstico y gestión. Estas incluyen herramientas para inspeccionar el estado reactivo de los objetos, acceder a datos crudos y gestionar manualmente el ciclo de vida de las estructuras observables. Estas capacidades apoyan la creación de capas de datos predecibles y la sincronización de elementos de la interfaz de usuario con el estado de la aplicación.
Connects user interface elements to data models so that views update automatically whenever the underlying state is modified.