Votre agent IA vient d'acquérir des superpouvoirs pour les Core Web Vitals
Connectez Claude Code à vos données de terrain CoreDash. Il identifie votre pire goulot d'étranglement parmi des millions de chargements de pages, trace la cause racine dans Chrome et rédige le correctif. La performance web par agent IA — pas un simple rapport, mais la ligne de code exacte qui doit être modifiée.
Installer en 2 minutes Démarrer l'essai gratuit de CoreDash »Trusted by market leaders · Client results
Les outils de performance IA ont un problème de données
La plupart des agents IA optimisent pour Lighthouse. Un score synthétique sur un appareil simulé que Google n'utilise pas pour le classement. Un agent IA de performance web utile se base sur les mêmes données que Google : de vrais utilisateurs sur des téléphones d'entrée de gamme, des connexions instables et des continents que votre machine de développement n'a jamais vus.
Lighthouse n'est pas votre signal de classement
Google effectue son classement sur la base des données de terrain CrUX de vrais utilisateurs Chrome sur 28 jours. Obtenir un score Lighthouse parfait tout en échouant sur le terrain arrive constamment. 52 % des sites mobiles échouent à au moins un Core Web Vital sur le terrain.
Des agents aveugles font des corrections aveugles
Sans données d'utilisateurs réels, un agent IA ne sait pas quelle page est lente, quel élément est le goulot d'étranglement, ni si son correctif a été utile. Il optimise une simulation et s'arrête là. Vos utilisateurs réels ne sont pas de cet avis.
L'investigation manuelle prend des heures
Segmenter les données. Émettre des hypothèses. Exécuter une trace. Confirmer. Rédiger le correctif. Un ingénieur de performance senior passe 2 à 4 heures par problème. Multipliez cela par chaque page lente de votre site.
L'INP ne peut absolument pas être simulé en laboratoire L 'Interaction to Next Paint mesure comment les utilisateurs réels interagissent avec votre page. Aucun outil synthétique ne peut reproduire le comportement d'un utilisateur réel : où ils appuient, à quelle vitesse ils font défiler, quel appareil ils tiennent. Lighthouse ne rapporte même pas l'INP. Si votre agent IA exécute Lighthouse, il est aveugle à vos pires problèmes d'interactivité. Les données de terrain sont la seule source.
Deux sources de vérité : Les données de terrain rencontrent les preuves du navigateur
CWV Superpowers combine les données d'utilisateurs réels de CoreDash avec des traces Chrome ciblées. Les données de terrain lui indiquent ce qui est lent. Chrome lui indique pourquoi.
CoreDash indique à l'agent ce qui est lent
CoreDash suit chaque chargement de page de chaque utilisateur réel. Chaque métrique, attribuée à l'élément exact causant le problème. Aucun échantillonnage, aucune limite.
Lorsque CoreDash rapporte un LCP de 4,2 secondes avec un Load Delay consommant 52 % du temps total sur div.hero > img.main, l'agent sait exactement où chercher. Ce n'est pas une supposition. C'est une mesure issue de millions de sessions réelles.
La compétence interroge plus de 25 dimensions CoreDash : élément LCP, type d'élément, état de priorité, décomposition des phases, cible d'interaction INP, scripts LOAF, élément de décalage CLS, type d'appareil, type de visiteur, vitesse du réseau, tendances sur 7 jours.
Chrome indique à l'agent pourquoi c'est lent
CWV Superpowers visite la page avec une émulation mobile : Fast 3G, limitation CPU 4x. Il trace uniquement la phase de goulot d'étranglement que CoreDash a identifiée.
Le Load Delay est le goulot d'étranglement ? L'agent examine la cascade réseau à la recherche d'écarts de découverte (discovery gaps). Le Render Delay ? Il recherche les scripts bloquants et les retards de chargement de polices.
Le résultat : des captures d'écran en pellicule (filmstrip), une cascade réseau et des preuves ciblées qui expliquent la cause racine exposée par vos données de terrain.
Raisonnement proportionnel, pas des seuils absolus
Lighthouse vous dit "Le Render Delay est de 350ms". Est-ce là le problème ? Aucune idée. CWV Superpowers identifie le goulot d'étranglement comme la phase consommant le plus grand pourcentage du temps total.
L'INP est de 350ms. Input Delay 70ms (20%), Processing 80ms (23%), Presentation 200ms (57%). Presentation est le goulot d'étranglement, même si 200ms semble correct de manière isolée. Le corriger fait vraiment la différence. Optimiser l'Input Delay serait à peine perceptible.
Cela évite l'erreur la plus courante dans le travail de performance : corriger la mauvaise chose.
Cinq étapes : De "quelque chose est lent" à la correction du code
Posez-lui une question. Cinq étapes plus tard, vous obtenez un correctif étayé par des preuves d'utilisateurs réels.
1. Découverte
Analyse vos données CoreDash à la recherche des pires pages et métriques. Priorise les mauvaises notes, le mobile, les pages à fort trafic et les scores du 75e centile (p75) qui cachent une longue traîne médiocre.
2. Diagnostic
Décompose la métrique en phases. LCP : TTFB, Load Delay, Load Time, Render Delay. INP : Input Delay, Processing, Presentation. Nomme le goulot d'étranglement en pourcentage.
3. Trace Chrome
Visite la page avec une émulation mobile. Trace uniquement la phase de goulot d'étranglement de l'étape 2. Capture la cascade réseau, la pellicule (filmstrip) et les preuves de ressources bloquantes.
4. Cause Racine
Combine les deux sources de preuves en une seule déclaration : l'élément, la cause, les métriques CoreDash et ce que Chrome a confirmé. Aucune ambiguïté.
5. Correctif ou Rapport
À vous de choisir. Appliquez la correction de code avec le fichier, la ligne, l'élément, l'avant/après. Générez un rapport HTML autonome avec des graphiques et des preuves. Ou les deux.
Plus de 25 dimensions : Tous les angles couverts par vos données de terrain
Ce sont les véritables dimensions CoreDash que l'agent interroge. Pas un résumé. L'image complète.
LCP (Largest Contentful Paint)
Élément LCP Type d'élément État de priorité Phase TTFB Load Delay Load Time Render DelayINP (Interaction to Next Paint)
Cible INP Input Delay Processing Presentation Scripts LOAF État de chargementCLS (Cumulative Layout Shift)
Élément décalé Cause du décalage Moment du décalageSegments
Type d'appareil Pays Navigateur Système d'exploitation Connexion Type de visiteur Chemin de la pageTendances
Delta sur 7 jours Base de référence sur 28 jours Détection de régressionDiagnostic : Décomposition au niveau des phases pour chaque Core Web Vital
Pas seulement des scores. Chaque métrique est décomposée en phases à l'aide de l'attribution d'utilisateurs réels provenant de CoreDash.
Corriger le LCP avec l'IA : Diagnostic du Largest Contentful Paint
Décomposition en 4 phases : TTFB, Load Delay, Load Time, Render Delay. Identifie quelle phase consomme la plus grande part du temps total.
Attribution d'élément : l'élément LCP exact, son type (image, texte, image d'arrière-plan, vidéo) et son état de priorité (fetchpriority, lazy loading).
Correctifs typiques : ajouter une directive de préchargement (preload), supprimer le lazy loading de l'image hero, optimiser le format d'image, corriger les scripts bloquant le rendu.
Corriger l'INP avec l'IA : Diagnostic de l'Interaction to Next Paint
Décomposition en 3 phases : Input Delay, Processing, Presentation. La seule métrique que vous ne pouvez pas simuler en laboratoire. Les données de terrain sont la seule source.
Attribution de script : Long Animation Frames (LOAF) nomme le fichier JavaScript exact et la durée. Plus l'état de chargement de la page au moment où l'interaction s'est produite.
Correctifs typiques : yield vers le thread principal, différer l'évaluation, diviser les gestionnaires d'événements, content-visibility pour les DOM volumineux.
CLS : Cumulative Layout Shift
5 modèles de causes : images sans dimensions, échanges de polices (font swaps), contenu injecté dynamiquement, ressources à chargement tardif, animations CSS sur les propriétés de mise en page.
Croisement de dimensions : compare mobile contre bureau, nouveaux visiteurs contre récurrents, réseaux rapides contre lents pour cerner la cause.
Correctifs typiques : ajouter width/height, font-display: optional, réservation de min-height, utiliser transform au lieu de top/left.
À quoi ressemble une déclaration de cause racine
Pas un vague "envisagez d'optimiser vos images". Voici le résultat réel. Suffisamment spécifique pour être examiné et fusionné.
Cause racine :
L'image LCP div.hero-banner > img.product-main sur /product/running-shoes-42 est découverte avec 1 980 ms de retard car elle manque d'une directive de preload et n'a pas de fetchpriority="high".
Preuves CoreDash :
Le LCP est de 3 820 ms (médiocre) sur mobile, p75. Le Load Delay est le goulot d'étranglement à 1 980 ms (52 % du total). État de priorité : 3 (non préchargé). Tendance : aggravation de +340 ms sur 7 jours.
Preuves Chrome :
La cascade réseau montre un écart de 1 940 ms entre le premier octet HTML et la requête de l'image. L'image n'est référencée qu'en CSS, invisible pour le scanner de préchargement.
Correctif :
Ajoutez <link rel="preload" href="/images/hero.jpg" as="image" fetchpriority="high"> dans templates/product.html à la ligne 12. Définissez fetchpriority="high" sur l'élément img à la ligne 47.
Conseil IA générique :
"Envisagez d'ajouter fetchpriority à votre image LCP et assurez un préchargement approprié des ressources critiques."
CWV Superpowers :
Élément : div.hero-banner > img.product-main
Fichier : templates/product.html, ligne 47
Preuve : 52 % du temps LCP dans le Load Delay (CoreDash p75). Écart de découverte de 1 940 ms (cascade Chrome).
Correctif : Changement de code de 2 lignes avec diff avant/après.
Comparaison : Comment se positionne CWV Superpowers
Différents outils résolvent différents problèmes. Voici ce que fait réellement chacun d'eux.
| Capacité | CoreDash + CWV Superpowers | Chrome DevTools MCP | PSI / Lighthouse MCP |
|---|---|---|---|
| Source de données | Utilisateurs réels (données de terrain sur 28 jours) | Session de labo unique | Chargement unique simulé |
| Mesure de l'INP | ✓ Interactions réelles | ✗ Aucun utilisateur réel | ✗ Non mesuré |
| Décomposition des phases | ✓ Phases LCP, INP, CLS | ~ Analyse manuelle | ✗ Score uniquement |
| Attribution d'élément | ✓ Élément exact + priorité | ~ Si vous savez où chercher | ~ Suggestions génériques |
| Raisonnement proportionnel | ✓ Goulot d'étranglement en % | ✗ Valeurs absolues | ✗ Valeurs absolues |
| Comparaison de segments | ✓ Appareil, pays, navigateur | ✗ Configuration unique | ✗ Configuration unique |
| Détection de tendances | ✓ Delta sur 7 jours | ✗ Ponctuel | ✗ Ponctuel |
| Traçage Chrome | ✓ Ciblé par phase | ✓ Accès complet | ✗ Aucun navigateur |
| Corrections de code | ✓ Fichier + ligne + diff | ~ Dépend de l'agent | ~ Conseils génériques |
Remarque : Chrome DevTools MCP est complémentaire. CWV Superpowers l'utilise pour un traçage ciblé une fois que les données de terrain ont identifié le goulot d'étranglement. Ils fonctionnent mieux ensemble.
Rapports : Déposez-les dans Slack, joignez-les à Jira
HTML autonome. Aucune dépendance. Aucune étape de build. Un seul fichier avec tout inclus (inline).
Rapport complet (avec Chrome)
Cartes de métriques codées par couleur, graphiques de décomposition des phases, captures d'écran en pellicule aux moments clés (premier rendu, LCP, chargé), cascade réseau en SVG, analyse de la cause racine et le correctif recommandé avec code avant/après.
Rapport RUM uniquement
Mêmes cartes de métriques et décomposition des phases, plus l'attribution des éléments et l'analyse de la cause racine. Pas de pellicule ni de cascade, mais la qualité du diagnostic est identique car les données de terrain sont la source de vérité.
Fonctionne avec n'importe quel client MCP
Claude Code : Compétence (skill) complète avec flux de travail automatisé. Découverte, diagnostic, traçage Chrome, corrections de code et rapports. Recommandé.
Cursor : Installation de plugin avec CoreDash MCP. Diagnostic complet et corrections de code directement dans votre éditeur.
VS Code, Windsurf, Gemini CLI : Tout client supportant les serveurs HTTP MCP se connecte à CoreDash. Mêmes données de terrain, même attribution.
Client Success
Don't just take my word for it
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 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."
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."
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."
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 Engineering, People Inc
"Seven brands, seven different stacks. Every single one got faster. No compromises on what makes each property unique."
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."
VP Engineering, Loop
"Mobile load time down 800ms. 7% lift in checkout conversion. The ROI justified the investment immediately."
En service en 2 minutes
Diagnostic automatisé des Core Web Vitals dans votre terminal. Vous avez besoin d'un compte CoreDash avec des données actives. Le niveau gratuit fonctionne.
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-superpower
claude --chrome
Trouve mon plus gros problème CWV et corrige-le. Obtenez votre clé d'API depuis CoreDash → Project Settings → API Keys (MCP). Affichée une seule fois. Stockée sous forme de hachage SHA-256. En lecture seule.
Cursor
/plugin-add cwv-superpowers
Ajoutez CoreDash à .cursor/mcp.json :
{
"mcpServers": {
"coredash": {
"url": "https://app.coredash.app/api/mcp",
"headers": {
"Authorization": "Bearer cdk_YOUR_API_KEY"
}
}
}
} Autres clients MCP
Point de terminaison (Endpoint) : https://app.coredash.app/api/mcp
En-tête (Header) : Authorization: Bearer cdk_YOUR_API_KEY
Fonctionne avec VS Code (mode agent Copilot), Windsurf, Gemini CLI, Claude Desktop et tout client HTTP MCP. Un seul point de terminaison de performance web MCP, pour chaque agent.
Foire aux questions
Ai-je besoin que Chrome soit ouvert pour utiliser CWV Superpowers ?
Non. Le traçage Chrome est optionnel. Sans lui, vous obtenez un diagnostic complet sur les données de terrain, les décompositions des phases, l'attribution des éléments et des suggestions de corrections de code basées uniquement sur les données CoreDash. Chrome ajoute les captures d'écran en pellicule, la cascade réseau et la confirmation visuelle de la cause racine. Les deux modes génèrent des rapports.
En quoi est-ce différent de l'exécution de Lighthouse dans mon agent IA ?
Lighthouse exécute un seul chargement synthétique sur votre machine. CWV Superpowers utilise 28 jours de données d'utilisateurs réels provenant de CoreDash : appareils réels, réseaux réels, interactions réelles. Il mesure l'INP à partir des tapotements d'utilisateurs réels (Lighthouse ne le peut pas). Il compare les segments (mobile contre bureau, Inde contre US). Et il utilise un raisonnement proportionnel pour trouver la phase de goulot d'étranglement, pas seulement des scores absolus.
Quels agents de codage IA sont supportés ?
Tout agent de codage IA pour la performance web qui supporte les serveurs MCP (Model Context Protocol). Claude Code dispose d'une compétence dédiée avec un flux de travail automatisé en 5 étapes. Cursor, VS Code (mode agent Copilot), Windsurf, Gemini CLI et Claude Desktop se connectent via le point de terminaison HTTP MCP de CoreDash. Les données de terrain et l'attribution sont identiques sur tous les clients.
CoreDash est-il gratuit ?
CoreDash propose un niveau gratuit qui fonctionne avec CWV Superpowers. Vous avez besoin que les données de votre site remontent (ajoutez la balise de script CoreDash). Le niveau gratuit n'a pas d'échantillonnage ni de limite de pages vues. Les clés d'API pour l'accès MCP sont disponibles sur tous les forfaits.
Puis-je l'utiliser pour les sites de mes clients ?
Oui. Pour chaque projet CoreDash, vous pouvez créer un nombre illimité de clés d'API MCP dédiées. Ajoutez CoreDash à chaque site client, générez une clé d'API en lecture seule et configurez votre client MCP. L'agent ne voit que les données de ce projet. CWV Superpowers est sous licence MIT, il n'y a donc aucune restriction pour un usage commercial.
Open Source. Sans verrouillage.
L'automatisation des Core Web Vitals que vous pouvez inspecter et étendre. L'orchestrateur, les modules de diagnostic, la logique de traçage Chrome et les modèles de rapports sont tous sur GitHub. Découvrez comment ça marche. Forkez-le. Étendez-le. Contribuez.
Démarrez votre essai gratuit Voir sur GitHub