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.

1. Zainstaluj umiejętność w swoim środowisku pracy z AI (np. Claude, Copilot) — dodaj ją do dostępnych narzędzi lub zaimportuj z repozytorium sickn33.

2. Kiedy piszesz nowy komponent Angular lub pracujesz nad istniejącym kodem, wyzwól umiejętność i podaj kontekst — na przykład "Przejrzyj ten komponent pod kątem wydajności" lub "Jak zoptymalizować bundle size w tej aplikacji".

3. Umiejętność zwróci Ci reguły pogrupowane wg priorytetu — zacznij od kategorii CRITICAL (detekcja zmian, asynchroniczne operacje, optymalizacja pakietu), które mają największy wpływ na wydajność.

4. Zastosuj konkretne wskazówki do swojego kodu — na przykład włącz OnPush change detection w komponentach, użyj Signals zamiast tradycyjnych properties, lub zoptymalizuj lazy loading modułów.

5. Podczas refaktoryzacji istniejącego kodu odwołuj się do przewodnika dla każdej kategorii — od renderowania (@defer, trackBy, virtualization) przez server-side rendering aż po zarządzanie pamięcią i czyszczenie subskrypcji.

6. Wróć do umiejętności w trakcie code review — użyj jej jako listy kontrolnej, aby sprawdzić, czy kod spełnia best practices w zakresie wydajności, hydration i optymalizacji szablonów.