Toolverse
Wszystkie skille

web-perf

autor: cloudflare

Audytuj wydajność stron internetowych i mierz Core Web Vitals za pomocą Chrome DevTools

Instalacja

Wybierz klienta i sklonuj repozytorium do odpowiedniego katalogu skilli.

Instalacja

Szybkie info

Kategoria
Testowanie
Wyświetlenia
28

O skillu

Skill do analizy wydajności stron internetowych. Mierzy kluczowe metryki Core Web Vitals (FCP, LCP, TBT, CLS, Speed Index), identyfikuje zasoby blokujące renderowanie, łańcuchy zależności sieciowych, przesunięcia layoutu, problemy z cachowaniem i luki w dostępności. Używaj do audytu wydajności, profilowania, debugowania, optymalizacji szybkości ładowania i poprawy wyników Lighthouse.

Jak używać

  1. Upewnij się, że masz skonfigurowany serwer MCP chrome-devtools. Dodaj do konfiguracji MCP wpis: type local, command npx -y chrome-devtools-mcp@latest. Jeśli nie masz dostępu do narzędzi navigate_page lub performance_start_trace, zatrzymaj się i skonfiguruj serwer.

  2. Załaduj stronę do analizy, podając jej URL. Skill użyje narzędzia navigate_page, aby otworzyć stronę w Chrome DevTools.

  3. Uruchom śledzenie wydajności za pomocą performance_start_trace z opcją autoStop ustawioną na true i reload na true. To zbierze dane o metrikach Core Web Vitals i zasobach sieciowych.

  4. Przeanalizuj zebrane dane, sprawdzając konkretne zasoby blokujące renderowanie, rozmiary plików i czasy ładowania. Użyj list_network_requests, aby wyfiltrować zasoby po typie (Script, Stylesheet itp.), i get_network_request, aby uzyskać szczegóły konkretnego żądania.

  5. Zidentyfikuj problemy z dostępnością za pomocą take_snapshot w trybie verbose, aby uzyskać pełny raport dostępności.

  6. Otrzymaj konkretne rekomendacje: skill skupia się na działaniach z mierzalnym wpływem. Ignoruje problemy z zerowym wpływem na wydajność i priorytetyzuje zmiany, które rzeczywiście poprawią metryki.

Podobne skille