A Unified Styling Language

on YouTube ↗38m

" summary

A clear claim: colocating styles with components produces real CSS that is locally scoped, server-renderable and usable with progressive enhancement. Examples show a Seek single‑page app rendering correctly with JavaScript disabled using CSS Modules, server-side style extraction via Aphrodite to produce per-request critical CSS, and optimizer Styletron reducing a real-world stylesheet roughly by half. Tools used are concrete, optimizations measurable, and the component + CSS pipeline demonstrably works end to end.

AI-written summary · about

" chapters (11)

1. 0:00Start
2. 3:32THE HARDEST PROBLEM IN FRONT-END
3. 10:30HARD TO MAINTAIN HARD TO AUTOMATE
4. 10:46OPTIONAL OPTIMISATION
5. 14:44TREATING CLASSES LIKE INLINE STYLES
6. 16:15DYNAMIC, ZERO CONFIG ATOMIC CSS
7. 25:15Yoga's focus is on creating an expressive layout library, not implementing all of CSS.
8. 28:31CROSS PLATFORM, CROSS-DISCIPLINARY DESIGN SYSTEMS
9. 28:42CROSS-PLATFORM CODE AS THE SOURCE OF TRUTH
10. 30:45WITHOUT BREAKING PROGRESSIVE ENHANCEMENT
11. 31:58MISUNDERSTOOD COMMUNITIES

" related talks

• 29mA Unified Styling LanguageMark Dalgleish · CSS Conf EU 2017
• 38mModular CSSAndrey Okonechnikov · React Alicante 2017
• 33mThe past, present and future of CSS-in-JSMax Stoiber · Agent Conf 2020
• 15mCompilers in styling web UIRyan Tsao · dotCSS 2017
• 35mThe Rise of Modular StyleGlen Maddern · CSSConf.Asia 2015
• 34mCSS as a Service: Maintaining StyleShay Howe · PyOhio 2018
• 47mThe road to styled components, and the road aheadGlen Maddern · ReactFoo 2017
• 09mWriting Modular CSS with CSS modulesKatie Fenn · The Lead Developer 2016