Thoughtful Component Design
summary
Angular Material has over 50+ components and shows concrete design choices: prefer exposing native elements (input/button) instead of wrapping and forwarding dozens of bindings, refactor complex widgets into connected parts via directives (menu trigger/panel), measure layout only when unavoidable and account for server prerendering with Angular Universal, and avoid gratuitous DOM work for security reasons. Performance control uses zones via runOutsideAngular to skip change detection for scroll/animation. Examples include rewritten input API and composable menu wiring that simplify code and improve accessibility.
AI-written summary · about
chapters (5)
- 0:00Introduction
- 1:26Using native elements
- 6:35Thoughtful composition
- 10:05Dom manipulation practices
- 16:57Understanding the Angular Zone
related talks
28mFrom Scratch to Screen: The Art of Component Design in Angular
46mMaterial Design in practice with AngularJS
21mAngular for Designers
27mThe good, the bad and the ugly - Component architecture at scale
01h 18mA Deep Look At Angular Elements
48mAn Introduction Into Using Angular’s Material Design
56mHow to mess up your Angular UI Components
34mHigh-Performance Applications with Angular