Yapay Zeka Ajanınız Core Web Vitals Süper Güçleri Kazandı
Claude Code'u CoreDash saha verilerinize bağlayın. Milyonlarca sayfa yüklemesindeki en kötü darboğazınızı bulur, Chrome'da kök nedeni izler ve düzeltmeyi yazar. Bir rapor değil. Değişmesi gereken asıl kod satırı.
2 Dakikada Kur Ücretsiz CoreDash Denemesini Başlat »
Trusted by market leaders · Client results
Yapay Zeka Performans Araçlarının Bir Veri Sorunu Var
Çoğu yapay zeka ajanı Lighthouse için optimizasyon yapar. Google'ın sıralamalar için kullanmadığı, simüle edilmiş bir cihazdaki sentetik bir puan. Gerçek kullanıcılarınız bütçe dostu telefonlarda, zayıf bağlantılarda ve geliştirme makinenizin hiç görmediği kıtalardalar.
Lighthouse Sizin Sıralama Sinyaliniz Değil
Google, 28 gün boyunca gerçek Chrome kullanıcılarından gelen CrUX saha verilerine göre sıralama yapar. Mükemmel bir Lighthouse puanı ve başarısız bir saha puanı her zaman karşılaşılan bir durumdur. Mobil sitelerin %52'si sahada en az bir Core Web Vitals testinden kalmaktadır.
Kör Ajanlar Kör Düzeltmeler Yapar
Gerçek kullanıcı verileri olmadan, bir yapay zeka ajanı hangi sayfanın yavaş olduğunu, hangi elemanın darboğaz oluşturduğunu veya düzeltmesinin işe yarayıp yaramadığını bilemez. Bir simülasyonu optimize eder ve işini bitirir. Ancak gerçek kullanıcılarınız aynı fikirde değildir.
Manuel İnceleme Saatler Sürer
Verileri segmentlere ayırın. Hipotez kurun. Bir izleme çalıştırın. Onaylayın. Düzeltme taslağını oluşturun. Kıdemli bir performans mühendisi her sorun için 2 ila 4 saat harcar. Bunu sitenizdeki her yavaş sayfayla çarpın.
İki doğruluk kaynağı: Saha verileri tarayıcı kanıtlarıyla buluşuyor
CWV Superpowers, CoreDash gerçek kullanıcı verilerini hedeflenmiş Chrome izlemeleriyle birleştirir. Saha verileri ona neğin yavaş olduğunu söyler. Chrome ise nedenini açıklar.
CoreDash ajana neğin yavaş olduğunu söyler
CoreDash, her gerçek kullanıcıdan gelen her sayfa yüklemesini izler. Soruna neden olan tam elemana atfedilen her metrik. Örnekleme yok, sınır yok.
CoreDash, div.hero > img.main üzerinde toplam sürenin %52'sini tüketen Load Delay ile 4.2 saniyelik bir LCP bildirdiğinde, ajan tam olarak nereye bakacağını bilir. Bu bir tahmin değil. Milyonlarca gerçek oturumdan alınmış bir ölçüm.
Bu yetenek 25'ten fazla CoreDash boyutunu sorgular: LCP elemanı, eleman türü, öncelik durumu, aşama kırılımı, INP etkileşim hedefi, LOAF betikleri, CLS kayan elemanı, cihaz türü, ziyaretçi türü, ağ hızı, 7 günlük eğilimler.
Chrome ajana neden yavaş olduğunu söyler
CWV Superpowers sayfayı mobil emülasyon ile ziyaret eder: Hızlı 3G, 4x CPU yavaşlatma (throttling). Yalnızca CoreDash'in belirlediği darboğaz aşamasını izler.
Load Delay mi darboğaz? Ajan, keşif boşlukları için ağ şelalesini inceler. Render Delay mi? Engelleyici betikleri ve yazı tipi yükleme gecikmelerini arar.
Sonuç: film şeridi ekran görüntüleri, ağ şelalesi ve saha verilerinizin ortaya çıkardığı kök nedeni açıklayan hedeflenmiş kanıtlar.
Mutlak eşikler değil, oransal akıl yürütme
Lighthouse size "Render Delay 350ms'dir" der. Sorun bu mu? Hiçbir fikri yok. CWV Superpowers, toplam sürenin en büyük yüzdesini tüketen aşamayı darboğaz olarak belirler.
INP 350ms. Input Delay 70ms (%20), Processing 80ms (%23), Presentation 200ms (%57). Tek başına bakıldığında 200ms kulağa iyi gelse bile Presentation darboğazdır. Bunu düzeltmek durumu değiştirir. Input Delay'i optimize etmek ise neredeyse hiç fark edilmez.
Bu, performans çalışmalarındaki en yaygın hatayı önler: yanlış şeyi düzeltmek.
Beş adım: "Bir şeyler yavaş" noktasından kod düzeltmesine
Ona bir soru sorun. Beş adım sonra gerçek kullanıcı kanıtlarıyla desteklenen bir düzeltmeniz olur.
1. Keşif
CoreDash verilerinizi en kötü sayfalar ve metrikler için tarar. Kötü derecelendirmelere, mobile, yüksek trafikli sayfalara ve uzun bir kötü kuyruğu gizleyen p75 puanlarına öncelik verir.
2. Teşhis
Metriği aşamalara böler. LCP: TTFB, Load Delay, Load Time, Render Delay. INP: Input Delay, Processing, Presentation. Darboğazı yüzdesel olarak adlandırır.
3. Chrome İzlemesi
Sayfayı mobil emülasyonla ziyaret eder. Sadece 2. adımdaki darboğaz aşamasını izler. Ağ şelalesini, film şeridini ve engelleyici kaynak kanıtlarını yakalar.
4. Kök Neden
Her iki kanıt kaynağını tek bir ifadede birleştirir: eleman, neden, CoreDash metrikleri ve Chrome'un doğruladığı şey. Belirsizlik yok.
5. Düzeltme veya Rapor
Seçim sizin. Dosya, satır, eleman, öncesi/sonrası ile kod düzeltmesini uygulayın. Grafikler ve kanıtlar içeren bağımsız bir HTML raporu oluşturun. Veya her ikisini de yapın.
Teşhis: Her Core Web Vitals için aşama düzeyinde kırılım
Sadece puanlar değil. CoreDash'ten gelen gerçek kullanıcı atıfları kullanılarak aşamalara ayrılmış her metrik.
LCP: Largest Contentful Paint
4 aşamalı kırılım: TTFB, Load Delay, Load Time, Render Delay. Toplam sürenin en büyük payını hangi aşamanın tükettiğini belirler.
Eleman atfı: kesin LCP elemanı, türü (görsel, metin, arka plan görseli, video) ve öncelik durumu (fetchpriority, lazy loading).
Tipik düzeltmeler: preload ipucu ekleme, hero'dan lazy loading'i kaldırma, görsel formatını optimize etme, oluşturmayı engelleyen betiği düzeltme.
INP: Interaction to Next Paint
3 aşamalı kırılım: Input Delay, Processing, Presentation. Laboratuvarda simüle edemeyeceğiniz tek metrik. Tek kaynak saha verileridir.
Betik atfı: Long Animation Frames (LOAF) kesin JavaScript dosyasını ve süresini adlandırır. Ayrıca etkileşim gerçekleştiğindeki sayfa yükleme durumunu da içerir.
Tipik düzeltmeler: ana iş parçacığına yield yapma, değerlendirmeyi erteleme, olay işleyicilerini bölme, büyük DOM'lar için content-visibility.
CLS: Cumulative Layout Shift
5 neden deseni: boyutsuz görseller, yazı tipi değişimleri, dinamik olarak enjekte edilen içerik, geç yüklenen kaynaklar, düzen özellikleri üzerinde CSS animasyonları.
Çok boyutlu: nedeni daraltmak için mobil ile masaüstünü, yeni ile tekrar eden ziyaretçileri, hızlı ile yavaş ağları karşılaştırır.
Tipik düzeltmeler: width/height ekleme, font-display: optional, min-height rezervasyonu, top/left yerine transform kullanma.
Bir Kök Neden İfadesi Neye Benzer
"Görsellerinizi optimize etmeyi düşünün" gibi değil. Bu gerçek bir çıktıdır. İnceleyip birleştirmek (merge) için yeterince belirgin.
Kök neden:
/product/running-shoes-42 üzerindeki LCP görseli div.hero-banner > img.product-main, preload ipucu ve fetchpriority="high" eksikliği nedeniyle 1.980ms geç keşfediliyor.
CoreDash kanıtı:
Mobil cihazda p75'te LCP 3.820ms (zayıf). Load Delay 1.980ms ile (toplamın %52'si) darboğaz durumunda. Öncelik durumu: 3 (önceden yüklenmemiş). Eğilim: 7 günde +340ms kötüleşiyor.
Chrome kanıtı:
Ağ şelalesi HTML'nin ilk baytı ile görsel isteği arasında 1.940ms boşluk gösteriyor. Görsel yalnızca CSS'de referans verilmiş, preload tarayıcısı için görünmez durumda.
Düzeltme:
templates/product.html dosyasının 12. satırına <link rel="preload" href="/images/hero.jpg" as="image" fetchpriority="high"> ekleyin. 47. satırdaki img elemanına fetchpriority="high" ayarlayın.
Genel yapay zeka tavsiyesi:
"LCP görselinize fetchpriority eklemeyi düşünün ve kritik kaynakların uygun şekilde önceden yüklenmesini (preloading) sağlayın."
CWV Superpowers:
Eleman: div.hero-banner > img.product-main
Dosya: templates/product.html, line 47
Kanıt: LCP süresinin %52'si Load Delay'de (CoreDash p75). 1.940ms keşif boşluğu (Chrome şelalesi).
Düzeltme: Öncesi/sonrası farkı (diff) ile 2 satırlık kod değişikliği.
Raporlar: Slack'e bırakın, Jira'ya ekleyin
Bağımsız HTML. Bağımlılık yok. Derleme (build) adımı yok. Her şeyin satır içi (inline) olduğu tek bir dosya.
Tam Rapor (Chrome ile)
Renk kodlu metrik kartları, aşama kırılım grafikleri, önemli anlardaki film şeridi ekran görüntüleri (first paint, LCP, loaded), ağ şelalesi SVG'si, kök neden analizi ve öncesi/sonrası kodlarıyla önerilen düzeltme.
Yalnızca RUM Raporu
Aynı metrik kartları ve aşama kırılımı, ayrıca eleman atfı ve kök neden analizi. Film şeridi veya şelale yok, ancak saha verileri doğruluk kaynağı olduğu için teşhis kalitesi tamamen aynıdır.
Herhangi bir MCP istemcisi ile çalışır
Claude Code: Otomatik iş akışına sahip tam yetenek. Keşif, teşhis, Chrome izleme, kod düzeltmeleri ve raporlar. Önerilir.
Cursor: CoreDash MCP ile eklenti kurulumu. Editörünüzün içinde tam teşhis ve kod düzeltmeleri.
VS Code, Windsurf, Gemini CLI: HTTP MCP sunucularını destekleyen herhangi bir istemci CoreDash'e bağlanır. Aynı saha verileri, aynı atıf.
Client Success
Don't just take my word for it
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."
VP Engineering, People Inc
"Seven brands, seven different stacks. Every single one got faster. No compromises on what makes each property unique."
VP Engineering, Loop
"Mobile load time down 800ms. 7% lift in checkout conversion. The ROI justified the investment 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."
Product Lead, Miro
"Our dashboards were choking on main-thread work. 25% reduction in CPU usage. Users noticed immediately."
Lead Developer, Alza
"Transferred knowledge to our engineering team. We can now diagnose and resolve performance issues independently."
Head of Engineering, Swift
"Layout shift on checkout eliminated entirely. Went from 0.4 to 0.02 CLS across mobile and desktop."
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 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."
2 Dakika İçinde Çalıştırma
Veri akışı olan bir CoreDash hesabına ihtiyacınız var. Ücretsiz plan işinizi görür.
Claude Code
claude mcp add --transport http coredash \
https://app.coredash.app/api/mcp \
--header "Authorization: Bearer cdk_YOUR_API_KEY"
/install corewebvitals/cwv-superpowers
claude --chrome
Find my biggest CWV issue and fix it. API anahtarınızı CoreDash → Project Settings → API Keys (MCP) bölümünden alın. Bir kez gösterilir. SHA-256 özeti olarak saklanır. Salt okunurdur (Read-only).
Cursor
/plugin-add cwv-superpowers
CoreDash'i .cursor/mcp.json dosyasına ekleyin:
{
"mcpServers": {
"coredash": {
"url": "https://app.coredash.app/api/mcp",
"headers": {
"Authorization": "Bearer cdk_YOUR_API_KEY"
}
}
}
} Diğer MCP İstemcileri
Endpoint: https://app.coredash.app/api/mcp
Header: Authorization: Bearer cdk_YOUR_API_KEY
VS Code (Copilot agent modu), Windsurf, Gemini CLI, Claude Desktop ve herhangi bir HTTP MCP istemcisiyle çalışır.
Açık Kaynak. Bağlayıcılık Yok.
Orkestratör, teşhis modülleri, Chrome izleme mantığı ve rapor şablonları. Hepsi GitHub üzerinde. Nasıl çalıştığını okuyun. Forklayın. Genişletin. Katkıda bulunun.
Tahmin Etmeyi Bırakın. Teşhis Etmeye Başlayın.
Kıdemli bir performans mühendisinin 2 ila 4 saatini alan inceleme, artık bir konuşma içinde gerçekleşiyor. Ağır işleri ajan halleder. Siz inceler ve birleştirirsiniz (merge).
Ücretsiz Denemenizi Başlatın GitHub'da Görüntüleyin