CSS in JS - beware the Hype!
summary
Experiment compares a tiny React app called Park Club in three setups: vanilla CSS, bundling with webpack, and CSS-in-JS with styled-components. Measured result: first meaningful paint ~250ms first meaningful paint; vanilla CSS shows ~60ms loading and ~100ms scripting, a project once had a 1 megabyte CSS file. CSS-in-JS cuts loading but raises scripting and DOM nodes; naming and prop-driven styling reduce collisions but increase maintenance risk.
AI-written summary · about
chapters (5)
- 0:00Start
- 2:11CSS IS THE MAKEUP OF THE WEB
- 9:48Webpack with CSS Loader
- 19:05DESIGN SYSTEM
- 26:52TOOLS SHOULD SUPPORT YOU TO RETAIN CONVENTIONS & PATTERNS
