Styling Linear for the future with StyleX
Blog post from Linear
Linear migrated its React applications from styled-components to Meta’s StyleX through more than 1,000 pull requests, motivated by the need for improved runtime performance, clearer component styling boundaries, and reduced UI regressions after a redesign and React 18 upgrade. The team selected StyleX for its build-time style generation, deterministic merging, colocated styles, type-safe styling contracts, and constraints against externally restyling components, despite tradeoffs for patterns relying on unrestricted CSS. The migration combined a deterministic codemod, increasingly capable coding agents, manual validation, foundational design tokens, and an incremental leaf-component-first approach that allowed product development to continue. Linear encouraged adoption with visible progress tracking, PR bots, and component highlighting, then established custom linting and repository-wide checks to enforce StyleX conventions, styling APIs, precedence, design-token use, and theme safety. CSS Modules remain an explicit fallback for CSS-specific needs, while custom extensions support advanced generated theming and interaction behavior. Linear estimates that eliminating runtime style injection reduced main-thread CPU work by roughly 20–35% on view-heavy pages and improved performance by around 30% on a mid-tier machine, while also creating a more controlled styling system suitable for a growing, agent-assisted codebase.
No tracked trend matches for this post yet.
Use this post, company, and trend context to find content marketing opportunities, perform competitive analysis, or address product feature gaps via the Plushcap MCP server or the Plushcap API.