Awesome GitHub RepositoriesCSS Inlining

rrweb is a DOM session recording library and serialization framework used to record and replay web sessions. It converts the state of a web page into a serializable JSON data structure and tracks mutations to reconstruct user interactions within a replay engine. The system distinguishes itself by using a sandboxed iframe for reconstruction to isolate replayed content, preventing script execution and form submissions. It ensures visual consistency through CSS inline-style flattening and provides sensitive data masking to prevent private information from being captured. The project covers a br

dom-to-image is a programmatic tool for capturing the visual state of HTML elements as downloadable images or raw image data. It functions as a DOM to image converter that renders specific nodes as base64 data URLs, binary blobs, or pixel arrays. The library transforms HTML elements into raster or vector images by utilizing the HTML5 canvas API. It can retrieve raw byte arrays of a DOM node for low-level image manipulation as an RGBA pixel data extractor. The project covers web content rasterization and the generation of dynamic screenshots from live HTML content. It handles the conversion o

Critical is a tool for extracting and inlining the minimum CSS required to render above-the-fold content. It identifies the styles necessary for the initial visible portion of a page to reduce render-blocking requests and improve page load speed. The project generates resolution-specific stylesheets to optimize the initial paint across different device dimensions. It includes a utility to rebase asset URLs within extracted styles, ensuring that images and fonts load correctly when stylesheets are moved to different directories or content delivery networks. The tool provides a command-line in

Foundation Emails is a responsive HTML email framework designed to create layouts that render consistently across different screen sizes and email clients. It functions as a system for building responsive emails and includes a CSS inliner to convert external stylesheets into inline HTML attributes. The framework incorporates an HTML table layout generator that converts simplified custom tags into the complex table structures required for legacy email client rendering. This process automates the creation of layouts that maintain visual consistency in restrictive email software. The project pr

Grip is a GitHub API rendering tool and markdown previewer that transforms local markdown files into styled HTML. It functions as a converter for processing markdown text into HTML files and as a local server for verifying content appearance before it is committed to a repository. The project ensures visual parity with GitHub by using the GitHub API to render content, applying the specific styles used in repository comments, issues, and pull requests. It includes a mechanism to embed external CSS directly into generated HTML files for portable offline distribution and utilizes disk-based asse

CssToInlineStyles est un inliner CSS pour les emails HTML qui convertit les feuilles de style en attributs de style inline sur les éléments HTML. Il fonctionne comme un résolveur de style et un moteur de transformation, mappant les sélecteurs CSS aux balises HTML pour assurer un rendu visuel cohérent à travers divers clients et fournisseurs d'email. L'outil calcule les styles finaux calculés en appliquant les règles de spécificité et d'héritage avant d'injecter les propriétés résolues directement dans les attributs de style des éléments HTML correspondants. Il utilise le calcul de style basé sur le DOM et le mappage de sélecteurs pour déterminer quelles déclarations s'appliquent à chaque balise.

This project is an HTML renderer that produces error pages styled after the familiar design of a standard CDN provider (such as Cloudflare). It accepts customizable parameters for error code, description, location, and request metadata, and outputs a self-contained HTML page that can be served directly by web servers or reverse proxies as a branded error response. The renderer is built using Go templates with built-in injection prevention, and it embeds all styling inline within the HTML head to eliminate external dependencies. It applies automatic whitespace minification to reduce output siz

react-snap est un générateur de sites statiques et un outil de pré-rendu pour applications monopages (SPA). Il convertit les composants dynamiques côté client en fichiers HTML statiques via un navigateur headless, améliorant ainsi le référencement (SEO) et la vitesse de chargement initiale. Le projet intègre un crawler headless qui découvre automatiquement les routes de l'application en suivant les liens internes. Il inclut un optimiseur d'hydratation qui capture l'état de l'application et met en cache les réponses réseau durant le rendu, les intégrant directement dans le HTML pour synchroniser l'application côté client sans recharger les données. L'outil propose une suite d'optimisations de performance, dont l'inlining du CSS critique, le chargement asynchrone des scripts, ainsi que la génération de manifestes de ressources et d'en-têtes de préchargement. Il prend également en charge l'exécution de rendu en parallèle via des onglets de navigateur concurrents et peut bloquer les requêtes tierces pour empêcher l'exécution de scripts externes durant le build.

Email-Boilerplate is an HTML email template framework and design system providing a foundational code structure for developing newsletters and transactional emails. It serves as a cross-client email layout library designed to ensure consistent rendering across diverse desktop and mobile email applications. The project utilizes a table-based layout library and reusable code patterns to maintain structural integrity within restrictive email rendering engines. It employs a responsive design system that combines fluid hybrid scaling and semantic markup normalization to resolve common rendering in

This project is a Node.js email templating engine and SMTP delivery framework used for creating, rendering, and sending custom email templates. It provides a comprehensive suite for email orchestration, including a system for dispatching templated messages and a tool for generating custom layouts to standardize outbound messaging. The framework includes a dedicated HTML CSS inliner that converts external stylesheets into inline styles for consistent rendering across different email clients. It also features a multilingual localization tool for translating template text and subject lines, and