CSS-in-JS: FTW
summary
A concrete claim: component-oriented styling can compile to flat, namespaced CSS and cut runtime cost. A team prototypes styler ball that transpiles component CSS to vanilla CSS, supports React + TypeScript, server-side rendering, webpack/jest/node integration, and a VS Code plugin style intelligence for build-time linting and rule‑shaking. Wix adoption (platform with ~120 million sites and >50% engineers) drives performance and customization tradeoffs, and browser-level features like part/theme and Houdini move similar capabilities into native implementations.
AI-written summary · about
chapters (27)
- 0:00Start
- 2:39Cascading HTML style sheets proposal
- 5:20Gandallsopp
- 7:21Sir Uncle Timbo's design principles
- 7:34Principle of Least Power
- 8:50Design creator
- 9:12CSS is bad
- 9:43Inheritance and Cascade
- 10:15The era of components
- 11:08REACT
- 13:15Why is CSS for components a PITA?
- 20:46Introducing Mr. Potato
- 21:53A bucket of parts
- 22:05Personalizing a Potato-Bruce
- 23:05Mohawk: required:
- 24:16Custom Pseudo-Elements
- 25:13Custom States
- 27:09Latest Spec (30 May 18)
- 27:25Mix it all together
- 28:12Extra happy in Amsterdam
- 29:18A type system for CSS
- 31:25Number One Priority
- 33:05TOO LONG
- 34:25James Kyle again
- 35:51Goodbye, : shadow and /deep
- 36:32Hello, 11 part and theme
- 40:06Houdini: JS-in-your-CSS!
related talks
24mCSS in a Components World
31mCSS in JS: Is it worth the hype
23mCSS-in-JS
49mIf you're going out of San Francisco, be sure to wear Web Standards in your hair
26mCSS in JS: The Good & The Bad Parts
15mCompilers in styling web UI
31mUnique Value Proposition of CSSinJS and the Future
28mSee the Past, Present, and Future of CSS-in-JS