Awesome GitHub RepositoriesDOM Node Capture

Snapdom is a DOM capture engine that serializes live web page elements into images, videos, documents, and other formats. It converts any DOM subtree into PNG, JPG, WebP, SVG, PDF, or self-contained HTML, and can record animating elements as video files or animated GIFs using the browser's MediaRecorder API. The library distinguishes itself through a plugin-based architecture that allows custom output format handlers and pipeline hooks to extend the capture process without re-cloning the source element. It manages separate caches for images, styles, and fonts with preloading and clearing meth

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

BackstopJS est un framework de test de capture d'écran automatisé et un outil de test de régression visuelle conçu pour identifier les écarts au niveau du pixel entre différentes versions d'une application web. Il fonctionne comme une suite de tests d'automatisation de navigateur qui capture des instantanés visuels d'une interface utilisateur et les compare à des images de référence stockées pour détecter les changements involontaires. Le projet utilise un environnement de test conteneurisé via Docker pour garantir un rendu de navigateur cohérent et éviter les écarts visuels multi-plateformes. Il inclut une interface de diffing web qui permet aux utilisateurs d'analyser les différences visuelles et d'approuver les captures d'écran de référence mises à jour via un tableau de bord interactif. Le framework fournit des capacités d'automatisation des interactions avec le navigateur, y compris la possibilité de simuler des séquences utilisateur, de préparer des états de page et de contrôler le timing de capture. Il prend en charge la capture ciblée d'éléments DOM spécifiques, le masquage d'éléments basé sur des sélecteurs CSS pour éviter les faux positifs, et des seuils de différence de pixels configurables pour déterminer les échecs de test. L'outil génère des rapports HTML statiques et exporte les résultats dans des formats adaptés à l'intégration avec des systèmes d'intégration continue.

Flight is a JavaScript component framework and DOM interactivity library used to map behavioral logic to HTML nodes. It provides an event-driven architecture for building modular user interface elements and managing web application interactivity. The library distinguishes itself through a mixin-based system for injecting reusable functions and properties into components, promoting code reuse without rigid inheritance. It further enables behavior modification via function hooking, allowing developers to wrap existing methods to inject custom logic without altering the original source code. Th

Signals est une bibliothèque de gestion d'état réactive et un moteur de réactivité à grain fin. Il fonctionne comme un gestionnaire d'état de suivi des dépendances qui mappe les relations entre les valeurs pour garantir que les données dérivées et les éléments d'interface utilisateur restent synchronisés. La bibliothèque se distingue par une liaison DOM directe vers les nœuds, ce qui permet à l'état de mettre à jour des nœuds de texte spécifiques dans le navigateur sans déclencher un cycle de rendu de composant complet. Elle emploie un graphe de dépendances runtime et un traitement par lots atomique pour regrouper plusieurs modifications d'état en cycles de notification uniques, réduisant les exécutions redondantes. Le système couvre les conteneurs d'état réactifs, les signaux calculés évalués paresseusement et l'exécution d'effets secondaires avec une logique de nettoyage intégrée. Il fournit également des modèles d'état encapsulés pour la gestion du cycle de vie et des outils pour visualiser les chaînes de dépendances et surveiller la propagation de l'état. Le projet est implémenté en TypeScript.

This project is a Babel plugin that enables the use of JSX syntax within Vue 2 applications. It functions as a build-time transpilation tool, converting declarative JSX into standard JavaScript render functions that are compatible with the framework's component system. The plugin bridges the gap between JSX and the framework by mapping standard template directives, such as event handling and model binding, directly to JSX attributes. It also provides automatic injection of the component instance context, allowing developers to access reactive properties and lifecycle methods directly within t