Le mode sombre est passé d'une préférence de niche pour développeurs à une attente mainstream. FLIN a construit un système de thème complet : trois modes (clair, sombre, système), détection automatique de la préférence système, préférence utilisateur persistante via localStorage, transitions CSS fluides et application automatique à tous les plus de 365 composants FlinUI sans aucune configuration par composant.
Le ThemeProvider met à jour les CSS custom properties sur l'élément racine. Quand --flin-bg-primary change, chaque élément qui utilise var(--flin-bg-primary) dans ses styles se met à jour automatiquement. Le navigateur gère cela nativement -- pas d'itération JavaScript sur les éléments, pas de diffing de virtual DOM, pas de re-rendu de composants.
Zéro re-rendu de composants. Le moteur CSS du navigateur fait tout le travail.
Ceci est la partie 93 de la série "How We Built FLIN".
Navigation de la série : - [92] Attribute Reactivity - [93] Theme Toggle and Dark Mode (vous êtes ici) - [94] The Raw Tag: Escape Hatch for HTML - [95] 151 FlinUI Components Built by AI Agents