Components: Fast & Furious
summary
Shows that making components controllable components (supporting both controlled and uncontrolled modes) fixes reuse issues, cites UI zoo from Meritage as a tool. Demonstrates a performance win by switching CSS from left to transform instead of left (measured example: left animation costs several seconds vs ~250 ms with transform). Shows layout thrash with 500 widgets causing ~1s render and reduces it to ~45 ms by batch reads then writes with requestAnimationFrame and timeouts.
AI-written summary · about
chapters (18)
- 0:00Introduction
- 0:32Challenges with components
- 3:20Tabs
- 4:05HTML
- 5:26Tab Components
- 6:12Data Management
- 7:23Control
- 8:33Uncontrolled
- 11:49Controllable
- 12:38UI Zoo
- 14:56Animations
- 16:19Browser Rendering
- 18:31Animation
- 19:01Performance
- 19:58DOM Manipulation
- 20:45Page Lag
- 21:11Layout Raging
- 27:17Conclusion
related talks
44mFast but not Furious: Debugging User Interaction Performance Issues
33mSuper Fast Transitions
30mFast but not furious: debugging user interaction performance issues
30mFast but not furious: debugging user interaction performance issues
22mPerformant UIs Using CSS Magic
37mModern CSS Rendering Performance - Full-Scale Optimization
49mRendering without lumpy bits
07mData Driven Styling