web-performance-optimization

Skill do optymalizacji wydajności stron i aplikacji internetowych. Pomaga zmierzyć bieżące metryki za pomocą audytów Lighthouse, zidentyfikować wąskie gardła (duże bundle'e JavaScript, nieoptymalizowane obrazy, zasoby blokujące renderowanie), a następnie wdrożyć konkretne ulepszenia: code splitting, lazy loading, strategię cachowania, optymalizację ścieżki krytycznego renderowania. Wspiera pracę z Core Web Vitals (LCP, FID, CLS) i Time to Interactive. Pozwala porównać metryki przed i po zmianach.

1. Zainstaluj skill web-performance-optimization w swoim środowisku Claude/Copilot, dodając go do dostępnych narzędzi agenta.

2. Uruchom pomiar wydajności bieżącej: poproś skill o przeprowadzenie audytu Lighthouse dla Twojej strony lub aplikacji. Skill zbierze dane o szybkości ładowania, Core Web Vitals (LCP, FID, CLS), rozmiarach bundle'ów JavaScript i zidentyfikuje wąskie gardła w sieci.

3. Przeanalizuj zidentyfikowane problemy: skill wykaże duże bundle'e, nieoptymalizowane obrazy, zasoby blokujące renderowanie, wolne czasy odpowiedzi serwera, brakujące nagłówki cache'owania i długie zadania blokujące główny wątek.

4. Ustal priorytety ulepszeń: skupiaj się na zmianach o największym wpływie – optymalizacji ścieżki krytycznego renderowania, code splittingu, lazy loadingu, strategiach cachowania i optymalizacji skryptów trzecich.

5. Wdróż ulepszenia: skorzystaj ze wskazówek skill'u do optymalizacji zasobów (obrazy, czcionki, CSS, JavaScript), implementacji code splittingu, dodania nagłówków cache'owania i lazy loadingu zasobów niekrytycznych.

6. Zweryfikuj wyniki: ponownie uruchom audyt Lighthouse, porównaj metryki przed i po zmianach, aby potwierdzić poprawę wydajności i rzeczywistego doświadczenia użytkownika.