Measuring Coverage of Design System
summary
A static analyzer based on the npm package react-scanner parses the codebase AST to report component names, import sources, prop counts and instance locations, and feeds a dashboard that compares DS3 vs DS4 usage and shows HTML vs design-system elements. The team forks the scanner to add style components detection via template literals, flags anti-patterns like hard-coded colors and native anchor/input usage, and surfaces concrete issues — for example three snackbars used where one shared snackbar should be.
AI-written summary · about
related talks
20mFind Out If Your Design System Is Better Than Nothing
32mDesign System Visual Coverage in React Native applications
35mDesign system - From a Developer Point-of-View
22mDesign Systems, when and how much? — Diana Mounter
32mYour Guide to Making Scalable Design Systems
19mHarnessing React to Build Consistently Designed Applications
41mBuilding a design system with React in 2025, what's new?
28mA design system. A year in review