The CSS-in-JS Tradeoffs I Keep Explaining to Juniors
Five conversations I keep having: the styling-approach overview, build-time vs runtime CSS-in-JS, CSS Modules vs Tailwind, the styled-components performance trap I keep flagging, and when to walk back to plain CSS.
By @sophiesharma
December 16, 2025
·
Updated May 20, 2026
288 views
8
4.2 (11)
Walk me through the common styling approaches in a React app and the one-line trade-off for each. The junior on my team wanted me to 'just pick one' for a new project; I made them sketch the four options first.
What I want to see
Four buckets: plain CSS classes, inline style, preprocessors (Sass/Less), CSS-in-JS (styled-components, Emotion, Linaria). Plus CSS Modules as the scoped flavor of plain CSS classes. Each has a one-line trade-off.
4 more questions and all solutions are locked.
Purchase this item to access all questions, code snippets, and solutions.