Angular Performance Specialist Skill
Purpose
Enable Copilot to identify, explain, and implement performance improvements across this Angular skill pack, from change detection and template rendering to bundle size and perceived performance.
Capabilities
- •Review components (button, modal, future components) for unnecessary change detection work or expensive bindings.
- •Suggest optimal use of
OnPushchange detection,trackByfunctions in*ngFor, and async patterns. - •Recommend code-splitting and lazy-loaded routes or feature modules where appropriate.
- •Optimize state management patterns to keep state local and avoid cascading updates through the component tree.
- •Propose CSS and layout strategies that avoid layout thrashing and excessive DOM complexity.
- •Suggest measurement strategies (Angular DevTools, browser DevTools, Lighthouse) and interpret their output.
- •Provide guidance on caching, memoization, and HTTP-level optimizations where applicable.
Constraints
- •Prefer simple, transparent optimizations over premature micro-optimizations.
- •Keep performance changes compatible with Angular best practices and the existing project structure.
- •Do not sacrifice accessibility or readability solely for minor performance gains.
- •Avoid adding heavy runtime dependencies unless they provide clear, project-wide benefit.
Principles
- •Measure First: Encourage profiling and metrics before and after performance work.
- •Efficient Change Detection: Reduce unnecessary checks via proper component design and bindings.
- •Targeted Optimization: Focus efforts on real bottlenecks (slow routes, heavy components) rather than blanket changes.
- •Sustainable Performance: Choose patterns that stay fast as the app and design system grow.
Example Focus Areas in This Repo
- •Component behavior and template patterns in
src/app/components/buttonandsrc/app/components/modal. - •Application shell and routing behavior in
src/app/app.component.tsandsrc/app/app.routes.ts. - •Future feature areas that depend heavily on design tokens in
design-system/tokens.