GitHub's Primer Design System powers many of the site's user‑interface components, but by 2023 the rapid growth in component count created performance problems with the existing CSS‑in‑JS solution: initial page loads slowed due to client‑side style initialization, server‑side rendering performance degraded, and style updates became difficult to manage as component counts rose on a page【primary】. To solve these issues, the Primer team adopted CSS Modules, which lets developers write native CSS while keeping class names local by default and eliminating any client or server runtime behavior—styles are bundled into static CSS stylesheets sent with the HTML【primary】. The migration proceeded component by component: a new CSS Modules file was added alongside the existing JavaScript, a feature flag toggled between the old and new styles, and visual regression tests verified that snapshots remained identical before each rollout step; the flag was first enabled for internal teams, then GitHub staff, and finally all users【primary】.],
By December 2024, every Primer component had been moved to CSS Modules, yielding measurable performance gains: server‑side rendering time dropped by 55% and the time for components on a page to initialize fell by 25%【primary】. Encouraged by these results, GitHub sought to extend similar improvements across the rest of the product, which meant confronting the widespread use of the sx prop for inline styling—a pattern that offered excellent TypeScript support and co‑location with components but incurred high runtime costs and scaled poorly as the number of sx usages on a page grew【primary】.],
This table provides the detailed service-level improvements that support the article's claim of a 55% overall reduction in server-side rendering time.
To reduce sx dependency while preserving compatibility, the team created the @primer/styled‑react wrapper library, allowing existing sx‑based code to consume the newly migrated components while direct imports from @primer/react delivered the performance benefits of CSS Modules【primary】. A migration effort that peaked at roughly 7,760 sx props in April 2025 was completed by May 2026, aided by an internal VS Code plugin, a codemod, and later by Copilot coding agents that helped shrink the remaining count from 895 to zero in three weeks【primary】. Finally, the seven GitHub themes (each with a high‑contrast variant) still relied on styled‑components for their JavaScript utilities; after migrating @primer/react to non‑styled theming in late 2025, the team performed a similar gradual rollout, feature‑flagging the changes, and achieved a clean, 100% CSS‑Modules‑only stack by June 2026【primary】.
This chart illustrates the decline in sx prop usage mentioned in the article, correlating with the migration effort that peaked at 7,760 sx props in April 2025 and reached zero by mid‑2026.