Building the New Facebook with React and Relay
summary
Rebuilds facebook.com as a single-page app using React and Relay, co-locating GraphQL queries and components and adding a custom CSS-in-JS system that emits atomic CSS, inlines SVGs as React components, converts pixel design units to REMs for accessibility, and uses CSS variables for theming. Build-time optimization deduplicates rules so global CSS drops from about 400 kilobytes to 74 kilobytes, enabling dark mode, fewer runtime costs, and smoother app-like interactions.
AI-written summary · about
chapters (10)
- 0:00Intro
- 0:17Welcome
- 3:40Our Library
- 5:55Dark Mode
- 7:11Monochrome Icons
- 8:16Accessibility
- 8:46Fonts
- 10:06Runtime checks
- 11:20Atomic CSS
- 12:44Deduplication
