Agent skill · software engineering · aiskillstore

angular-best-practices

Angular performance optimization and best practices guide. Use when writing, reviewing, or refactoring Angular code for optimal performance, bundle size, and rendering efficiency.

Why this skill is useful

Provides specific performance optimization patterns and best practices for Angular that the AI wouldn't reliably generate on its own.

What it needs

About 7k tokens when loaded. Last updated 2026-08-07. 405 stars on the source repository.

What this skill does

Angular Best Practices Comprehensive performance optimization guide for Angular applications. Contains prioritized rules for eliminating performance bottlenecks, optimizing bundles, and improving rendering. When to Use Reference these guidelines when: Writing new Angular components or pages Implementing data fetching patterns Reviewing code for performance issues Refactoring existing Angular code Optimizing bundle size or load times Configuring SSR/hydration --- Rule Categories by Priority Priority Category Impact Focus -------- --------------------- ---------- ------------------------------- 1 Change Detection CRITICAL Signals, OnPush, Zoneless 2 Async Waterfalls CRITICAL RxJS patterns, SSR preloading 3 Bundle Optimization CRITICAL Lazy loading, tree shaking 4 Rendering Performance HIGH @defer, trackBy, virtualization 5 Server-Side Rendering HIGH Hydration, prerendering 6 Template Optimization MEDIUM Control flow, pipes 7 State Management MEDIUM Signal patterns, selectors 8 Memory Management LOW-MEDIUM Cleanup, subscriptions --- 1. Change Detection (CRITICAL) Use OnPush Change Detection Prefer Signals Over Mutable Properties Enable Zoneless for New Projects Benefits: No zone.js patches on async APIs Smaller bundle (~15KB savings) Clean stack traces for debugging Better micro-frontend compatibility --- 2. Async Operations & Waterfalls (CRITICAL) Eliminate Sequential Data Fetching Avoid Client-Side Waterfalls in SSR --- 3. Bundle Optimization (CRITICAL) Lazy Load Routes Use @defer for Heavy Components Avoid Barrel File Re-exports Dynamic Import Third-Party Libraries --- 4. Rendering Performance (HIGH) Always Use trackBy with @for Use Virtual Scrolling for Large Lists Prefer Pure Pipes Over Methods Use computed() for Derived Data --- 5. Server-Side Rendering (HIGH) Configure Incremental Hydration Defer Non-Critical Content Use TransferState for SSR Data --- 6. Template Optimization (MEDIUM) Use New Control Flow Syntax Avoid Complex Template Expressions --- 7. …

How to use it

Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:

@skills aiskillstore/angular-best-practices

View the source on GitHub

Browse the @skills marketplace