Twój agent AI właśnie zyskał Supermoce Core Web Vitals
Połącz Claude Code ze swoimi danymi z pola CoreDash. Znajduje on najgorsze wąskie gardło wśród milionów załadowań stron, śledzi główną przyczynę w Chrome i pisze poprawkę. Wydajność webowa oparta na agentach to nie raport, ale konkretna linijka kodu, która wymaga zmiany.
Zainstaluj w 2 minuty Rozpocznij darmowy okres próbny CoreDash »Trusted by market leaders · Client results
Narzędzia wydajnościowe AI mają problem z danymi
Większość agentów AI optymalizuje pod kątem Lighthouse. Syntetycznego wyniku na symulowanym urządzeniu, którego Google nie używa do rankingów. Przydatny agent AI ds. wydajności webowej zaczyna od tych samych danych co Google: rzeczywistych użytkowników na budżetowych telefonach, z niestabilnymi połączeniami i z kontynentów, których twoja maszyna deweloperska nigdy nie widziała.
Lighthouse to nie twój sygnał rankingowy
Google ustala ranking na podstawie danych z pola CrUX od rzeczywistych użytkowników Chrome z 28 dni. Idealny wynik Lighthouse i oblany wynik z pola zdarzają się cały czas. 52% mobilnych stron oblało przynajmniej jeden wskaźnik Core Web Vitals w polu.
Ślepi agenci wprowadzają ślepe poprawki
Bez danych rzeczywistych użytkowników, agent AI nie wie, która strona jest wolna, który element jest wąskim gardłem, ani czy jego poprawka pomogła. Optymalizuje symulację i na tym kończy. Twoi rzeczywiści użytkownicy mają inne zdanie.
Ręczne badanie zajmuje godziny
Segmentuj dane. Stawiaj hipotezy. Uruchom śledzenie. Potwierdź. Sporządź poprawkę. Doświadczony inżynier wydajności spędza od 2 do 4 godzin na jeden problem. Pomnóż to przez każdą wolną stronę w twojej witrynie.
INP w ogóle nie da się zasymulować w laboratorium Interaction to Next Paint mierzy, jak rzeczywiści użytkownicy wchodzą w interakcję z twoją stroną. Żadne syntetyczne narzędzie nie jest w stanie odtworzyć zachowania rzeczywistych użytkowników: gdzie dotykają, jak szybko przewijają, jakie urządzenie trzymają w ręku. Lighthouse nawet nie raportuje INP. Jeśli twój agent AI uruchamia Lighthouse, jest ślepy na twoje najgorsze problemy z interaktywnością. Dane z pola to jedyne źródło.
Dwa źródła prawdy: Dane z pola spotykają się z dowodami z przeglądarki
CWV Superpowers łączy dane rzeczywistych użytkowników CoreDash z ukierunkowanymi śladami z Chrome. Dane z pola mówią mu, co działa wolno. Chrome mówi mu, dlaczego.
CoreDash mówi agentowi, co działa wolno
CoreDash śledzi każde załadowanie strony od każdego rzeczywistego użytkownika. Każda metryka przypisana do konkretnego elementu powodującego problem. Bez próbkowania, bez limitów.
Kiedy CoreDash raportuje 4,2-sekundowe LCP, gdzie opóźnienie ładowania zajmuje 52% całkowitego czasu na div.hero > img.main, agent dokładnie wie, gdzie szukać. To nie domysły. To pomiar z milionów rzeczywistych sesji.
Umiejętność odpytuje ponad 25 wymiarów CoreDash: element LCP, typ elementu, stan priorytetu, podział na fazy, cel interakcji INP, skrypty LOAF, przesuwający się element CLS, typ urządzenia, typ odwiedzającego, prędkość sieci, trendy z 7 dni.
Chrome mówi agentowi, dlaczego coś działa wolno
CWV Superpowers odwiedza stronę z emulacją mobilną: Fast 3G, 4-krotne dławienie CPU. Śledzi tylko fazę wąskiego gardła, którą zidentyfikował CoreDash.
Opóźnienie ładowania (Load Delay) jest wąskim gardłem? Agent bada sieć (waterfall) pod kątem luk w wykrywaniu. Opóźnienie renderowania (Render Delay)? Szuka blokujących skryptów i opóźnień w ładowaniu czcionek.
Rezultat: zrzuty ekranu w postaci taśmy filmowej, sieć (waterfall) i konkretne dowody wyjaśniające główną przyczynę ujawnioną przez dane z pola.
Rozumowanie proporcjonalne, a nie absolutne progi
Lighthouse mówi ci: "Render Delay wynosi 350 ms." Czy to jest problem? Nie wiadomo. CWV Superpowers identyfikuje wąskie gardło jako fazę konsumującą największy procent całkowitego czasu.
INP wynosi 350 ms. Input Delay 70 ms (20%), przetwarzanie 80 ms (23%), prezentacja 200 ms (57%). Prezentacja to wąskie gardło, nawet jeśli 200 ms brzmi dobrze w odosobnieniu. Naprawienie tego przynosi widoczne efekty. Optymalizacja Input Delay będzie ledwo zauważalna.
Zapobiega to najczęstszemu błędowi w pracy nad wydajnością: naprawianiu niewłaściwych rzeczy.
Pięć kroków: Od "coś działa wolno" do poprawki w kodzie
Zadaj mu pytanie. Pięć kroków później masz poprawkę popartą dowodami od rzeczywistych użytkowników.
1. Odkrycie
Skanuje twoje dane CoreDash w poszukiwaniu najgorszych stron i metryk. Priorytetyzuje słabe oceny, ruch mobilny, strony o dużym natężeniu ruchu oraz wyniki p75, które ukrywają długi ogon słabych wyników.
2. Diagnoza
Rozbija metrykę na fazy. LCP: TTFB, Load Delay, Load Time, Render Delay. INP: Input Delay, przetwarzanie, prezentacja. Nazywa wąskie gardło według wartości procentowej.
3. Śledzenie w Chrome
Odwiedza stronę z emulacją mobilną. Śledzi tylko fazę wąskiego gardła z kroku 2. Rejestruje sieć (waterfall), taśmę filmową i dowody o blokujących zasobach.
4. Główna przyczyna
Łączy oba źródła dowodów w jedno stwierdzenie: element, przyczynę, metryki CoreDash i to, co potwierdził Chrome. Bez dwuznaczności.
5. Poprawka lub raport
Twój wybór. Zastosuj poprawkę kodu z podaniem pliku, wiersza, elementu oraz stanu przed/po. Wygeneruj samodzielny raport HTML z wykresami i dowodami. Albo jedno i drugie.
Ponad 25 wymiarów: Każdy kąt, który obejmują twoje dane z pola
To są rzeczywiste wymiary CoreDash, które odpytuje agent. Nie podsumowanie. Pełen obraz.
LCP (Largest Contentful Paint)
Element LCP Typ elementu Stan priorytetu Faza TTFB Opóźnienie ładowania Czas ładowania Opóźnienie renderowaniaINP (Interaction to Next Paint)
Cel INP Opóźnienie wejścia (Input Delay) Przetwarzanie Prezentacja Skrypty LOAF Stan ładowaniaCLS (Cumulative Layout Shift)
Przesuwający się element Przyczyna przesunięcia Czas przesunięciaSegmenty
Typ urządzenia Kraj Przeglądarka System operacyjny Połączenie Typ odwiedzającego Ścieżka stronyTrendy
Delta z 7 dni Baza bazowa z 28 dni Wykrywanie regresjiDiagnoza: Rozbicie na fazy dla każdego wskaźnika Core Web Vitals
Nie tylko wyniki. Każda metryka rozbita na fazy przy użyciu atrybucji rzeczywistych użytkowników z CoreDash.
Napraw LCP za pomocą AI: Diagnoza Largest Contentful Paint
Rozbicie na 4 fazy: TTFB, Load Delay, Load Time, Render Delay. Identyfikuje, która faza pochłania największą część całkowitego czasu.
Atrybucja elementu: dokładny element LCP, jego typ (obraz, tekst, obraz w tle, wideo) oraz stan priorytetu (fetchpriority, leniwe ładowanie).
Typowe poprawki: dodanie wskazówki preload, usunięcie leniwego ładowania z sekcji hero, optymalizacja formatu obrazu, naprawa blokującego skryptu.
Napraw INP za pomocą AI: Diagnoza Interaction to Next Paint
Rozbicie na 3 fazy: Input Delay, przetwarzanie, prezentacja. Jedyna metryka, której nie można symulować w laboratorium. Dane z pola to jedyne źródło.
Atrybucja skryptu: Long Animation Frames (LOAF) wskazuje dokładny plik JavaScript i czas trwania. Dodatkowo stan załadowania strony w momencie wystąpienia interakcji.
Typowe poprawki: yield do wątku głównego, odroczenie oceny, podział procedur obsługi zdarzeń, content-visibility dla dużych drzew DOM.
CLS: Cumulative Layout Shift
5 wzorców przyczyn: obrazy bez wymiarów, podmienianie czcionek, dynamicznie wstrzykiwana treść, późno ładujące się zasoby, animacje CSS na właściwościach układu.
Wielowymiarowość: porównuje urządzenia mobilne i komputery, nowych i powracających odwiedzających, szybkie i wolne sieci, aby zawęzić przyczynę.
Typowe poprawki: dodanie szerokości/wysokości, font-display: optional, rezerwacja min-height, użycie transform zamiast top/left.
Jak wygląda oświadczenie o głównej przyczynie
Nie "rozważ optymalizację swoich obrazów." To jest rzeczywisty wynik. Wystarczająco konkretny do zrecenzowania i wdrożenia.
Główna przyczyna:
Obraz LCP div.hero-banner > img.product-main na /product/running-shoes-42 jest wykrywany z opóźnieniem 1 980 ms, ponieważ brakuje mu wskazówki preload i nie ma atrybutu fetchpriority="high".
Dowody CoreDash:
LCP wynosi 3 820 ms (słabo) na urządzeniach mobilnych, wskaźnik p75. Load Delay jest wąskim gardłem przy 1 980 ms (52% całości). Stan priorytetu: 3 (brak preload). Trend: pogarszający się o +340 ms w ciągu 7 dni.
Dowody z Chrome:
Sieć (waterfall) pokazuje 1 940 ms luki między pierwszym bajtem HTML a żądaniem obrazu. Obraz jest przywoływany tylko w CSS, niewidoczny dla skanera preload.
Poprawka:
Dodaj <link rel="preload" href="/images/hero.jpg" as="image" fetchpriority="high"> do pliku templates/product.html w linii 12. Ustaw atrybut fetchpriority="high" dla elementu img w linii 47.
Ogólna porada AI:
"Rozważ dodanie atrybutu fetchpriority do swojego obrazu LCP i upewnij się, że krytyczne zasoby ładują się poprawnie jako preload."
CWV Superpowers:
Element: div.hero-banner > img.product-main
Plik: templates/product.html, linia 47
Dowód: 52% czasu LCP przypada na Load Delay (CoreDash p75). 1 940 ms luki w wykrywaniu (sieć w Chrome).
Poprawka: Zmiana kodu w 2 liniach z widokiem diff przed/po.
Porównanie: Jak wypada CWV Superpowers
Różne narzędzia rozwiązują różne problemy. Oto co tak naprawdę robi każde z nich.
| Możliwość | CoreDash + CWV Superpowers | Chrome DevTools MCP | PSI / Lighthouse MCP |
|---|---|---|---|
| Źródło danych | Rzeczywiści użytkownicy (28 dni danych z pola) | Pojedyncza sesja laboratoryjna | Symulowane pojedyncze załadowanie |
| Pomiar INP | ✓ Rzeczywiste interakcje | ✗ Brak rzeczywistych użytkowników | ✗ Brak pomiaru |
| Podział na fazy | ✓ Fazy LCP, INP, CLS | ~ Ręczna analiza | ✗ Tylko wynik |
| Atrybucja elementu | ✓ Konkretny element + priorytet | ~ Jeśli wiesz, gdzie szukać | ~ Ogólne sugestie |
| Rozumowanie proporcjonalne | ✓ Wąskie gardło w % | ✗ Wartości absolutne | ✗ Wartości absolutne |
| Porównanie segmentów | ✓ Urządzenie, kraj, przeglądarka | ✗ Jedna konfiguracja | ✗ Jedna konfiguracja |
| Wykrywanie trendów | ✓ Delta z 7 dni | ✗ Punkt w czasie | ✗ Punkt w czasie |
| Śledzenie w Chrome | ✓ Ukierunkowane według fazy | ✓ Pełny dostęp | ✗ Brak przeglądarki |
| Poprawki kodu | ✓ Plik + linia + diff | ~ Zależne od agenta | ~ Ogólne porady |
Uwaga: Chrome DevTools MCP jest komplementarne. CWV Superpowers używa go do ukierunkowanego śledzenia, gdy dane z pola zidentyfikują wąskie gardło. Działają najlepiej razem.
Raporty: Wrzuć na Slacka, załącz w Jira
Samodzielny HTML. Bez zależności. Bez procesu kompilacji (build). Jeden plik, w którym wszystko zawarte jest wewnątrz.
Pełen raport (z Chrome)
Karty metryk oznaczone kolorami, wykresy podziału na fazy, zrzuty ekranu w postaci taśmy filmowej w kluczowych momentach (pierwsze wyrenderowanie, LCP, w pełni załadowana strona), sieć (waterfall) w formacie SVG, analiza głównej przyczyny oraz zalecana poprawka kodu z widokiem przed i po.
Raport wyłącznie z RUM
Te same karty metryk i podział na fazy, a do tego atrybucja elementów i analiza głównych przyczyn. Brak taśmy filmowej czy sieci (waterfall), ale jakość diagnozy jest identyczna, ponieważ to dane z pola stanowią źródło prawdy.
Działa z każdym klientem MCP
Claude Code: Pełna umiejętność ze zautomatyzowanym przepływem pracy. Odkrywanie, diagnoza, śledzenie z Chrome, poprawki w kodzie i raporty. Polecane.
Cursor: Instalacja pluginu z CoreDash MCP. Pełna diagnoza i poprawki kodu prosto w edytorze.
VS Code, Windsurf, Gemini CLI: Każdy klient obsługujący serwery HTTP MCP łączy się z CoreDash. Te same dane z pola, ta sama atrybucja.
Client Success
Don't just take my word for it
Product Lead, Miro
"Our dashboards were choking on main-thread work. 25% reduction in CPU usage. Users noticed immediately."
Head of Digital, Rituals
"We used to break performance every other sprint. He set up budgets in our pipeline. Haven't had a regression since."
Lead Developer, Alza
"Transferred knowledge to our engineering team. We can now diagnose and resolve performance issues independently."
CTO, DPG Media
"He found bottlenecks in our component library that we'd missed for two years. Performance gains were visible within days."
Head of Engineering, Swift
"Layout shift on checkout eliminated entirely. Went from 0.4 to 0.02 CLS across mobile and desktop."
VP Engineering, Loop
"Mobile load time down 800ms. 7% lift in checkout conversion. The ROI justified the investment immediately."
VP Engineering, People Inc
"Seven brands, seven different stacks. Every single one got faster. No compromises on what makes each property unique."
Head of Platform, Adevinta
45% reduction in blocking time across 15 marketplaces. INP from 440ms to 64ms on Fotocasa alone. Google wrote up the results on web.dev.
VP Product, Expedia Group
"We had 80+ third-party scripts and were failing CWV on every major property. Arjen got us passing without touching our ad revenue."
Engineering Manager, Zalando
"Every other audit we've had gave us a list of problems. This one told us exactly what to fix first and why."
Gotowe do uruchomienia w 2 minuty
Zautomatyzowana diagnoza Core Web Vitals w Twoim terminalu. Potrzebujesz konta CoreDash, z którego napływają dane. Darmowy pakiet też działa.
Claude Code
claude mcp add --transport http coredash \
https://app.coredash.app/api/mcp \
--header "Authorization: Bearer cdk_YOUR_API_KEY"
/plugin marketplace add corewebvitals/cwv-superpowers
/plugin install cwv-superpowers@cwv-superpowers
claude --chrome
Find my biggest CWV issue and fix it. Pobierz swój klucz API z CoreDash → Project Settings → API Keys (MCP). Pokazany tylko raz. Przechowywany jako hash SHA-256. Tylko do odczytu.
Cursor
/plugin-add cwv-superpowers
Dodaj CoreDash do .cursor/mcp.json:
{
"mcpServers": {
"coredash": {
"url": "https://app.coredash.app/api/mcp",
"headers": {
"Authorization": "Bearer cdk_YOUR_API_KEY"
}
}
}
} Inni klienci MCP
Endpoint: https://app.coredash.app/api/mcp
Nagłówek: Authorization: Bearer cdk_YOUR_API_KEY
Działa z VS Code (w trybie agenta Copilot), Windsurf, Gemini CLI, Claude Desktop i z każdym klientem HTTP MCP. Jeden endpoint wydajności webowej MCP, każdy agent.
Często zadawane pytania
Czy muszę mieć uruchomionego Chrome, aby korzystać z CWV Superpowers?
Nie. Śledzenie w Chrome jest opcjonalne. Bez niego otrzymujesz pełną diagnozę danych z pola, podziały na fazy, atrybucję elementów i sugestie poprawek kodu oparte wyłącznie na danych z CoreDash. Chrome dodaje zrzuty ekranu na taśmie filmowej, sieć (waterfall) oraz wizualne potwierdzenie głównej przyczyny. Oba tryby generują raporty.
Czym to się różni od uruchomienia Lighthouse w moim agencie AI?
Lighthouse uruchamia jedno, syntetyczne załadowanie na twojej maszynie. CWV Superpowers korzysta z 28 dni danych rzeczywistych użytkowników z CoreDash: faktycznych urządzeń, prawdziwych sieci i rzeczywistych interakcji. Mierzy INP z faktycznych dotknięć na ekranach użytkowników (czego Lighthouse nie potrafi). Porównuje segmenty (urządzenia mobilne vs komputery, Indie vs USA). Używa też rozumowania proporcjonalnego do znalezienia fazy wąskiego gardła, a nie tylko bezwzględnych wyników.
Kórzy agenci programistyczni AI są obsługiwani?
Każdy agent programistyczny AI do wydajności webowej, który obsługuje serwery MCP (Model Context Protocol). Claude Code ma dedykowaną umiejętność ze zautomatyzowanym, 5-etapowym przepływem pracy. Cursor, VS Code (tryb agenta Copilot), Windsurf, Gemini CLI i Claude Desktop łączą się za pośrednictwem endpointa HTTP MCP CoreDash. Dane z pola oraz atrybucja są identyczne na wszystkich klientach.
Czy CoreDash jest darmowy?
CoreDash posiada darmowy pakiet (free tier), który działa z CWV Superpowers. Potrzebujesz przepływu danych ze swojej strony (dodaj tag skryptu CoreDash). W darmowym planie nie ma próbkowania ani limitów odsłon. Klucze API dla dostępu przez MCP są dostępne we wszystkich planach.
Czy mogę używać tego na stronach klientów?
Tak. Każdy projekt CoreDash ma własny klucz API. Dodaj CoreDash do każdej witryny klienta, wygeneruj klucz API tylko do odczytu i skonfiguruj swojego klienta MCP. Agent zobaczy tylko dane dla danego projektu. CWV Superpowers wydano na licencji MIT, więc nie ma żadnych ograniczeń co do użytku komercyjnego.
Open Source. Brak Lock-in'u.
Automatyzacja Core Web Vitals, którą możesz weryfikować i rozszerzać. Orkiestrator, moduły diagnozujące, logika śledzenia przez Chrome oraz szablony raportów są dostępne na GitHub. Przeczytaj, jak to działa. Rób forki. Rozbudowuj. Bierz w tym udział.
Rozpocznij darmowy okres próbny Zobacz na GitHubie