Votre Agent IA vient d'obtenir des superpouvoirs pour les Core Web Vitals
Connectez Claude Code à vos données de terrain CoreDash. Il trouve votre pire goulot d'étranglement parmi des millions de chargements de pages, trace la cause racine dans Chrome et écrit le correctif. Un agent de web performance, pas un rapport, mais la ligne de code exacte qui doit être modifiée.
Installer en 2 Minutes Démarrer l'essai gratuit CoreDash »Trusted by market leaders · Client results
Les outils d'IA pour la performance 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 les classements. Un agent IA utile pour la web performance part des 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 classe selon les données de terrain CrUX provenant d'utilisateurs réels de Chrome sur 28 jours. Un score Lighthouse parfait et un score de terrain défaillant arrivent tout le temps. 52 % des sites mobiles échouent à au moins un Core Web Vitals sur le terrain.
Des agents aveugles font des corrections aveugles
Sans données utilisateurs réelles, un agent IA ne sait pas quelle page est lente, quel élément est le goulot d'étranglement ou si sa correction a aidé. 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. Formuler 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 pas du tout être simulé en laboratoire Interaction to Next Paint mesure comment les vrais utilisateurs interagissent avec votre page. Aucun outil synthétique ne peut reproduire le comportement réel des utilisateurs : où ils tapent, à quelle vitesse ils font défiler, quel appareil ils tiennent. Lighthouse ne signale 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 réelles des utilisateurs CoreDash avec des traces Chrome ciblées. Les données de terrain lui disent ce qui est lent. Chrome lui dit 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 signale 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 provenant de millions de sessions réelles.
Le skill interroge plus de 25 dimensions CoreDash : élément LCP, type d'élément, état de priorité, répartition 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 du CPU 4x. Il trace uniquement la phase de goulot d'étranglement identifiée par CoreDash.
Le Load Delay est le goulot d'étranglement ? L'agent examine le network waterfall à la recherche d'écarts de découverte. Le Render Delay ? Il recherche des scripts bloquants et des retards de chargement des polices.
Le résultat : des captures d'écran filmstrip, un network waterfall et des preuves ciblées qui expliquent la cause racine exposée par vos données de terrain.
Raisonnement proportionnel, pas de seuils absolus
Lighthouse vous dit "Render Delay is 350ms." Est-ce 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 bouger les choses. Optimiser l'Input Delay se remarque à peine.
Cela évite l'erreur la plus courante dans le travail d'optimisation des performances : corriger la mauvaise chose.
Cinq étapes : De "quelque chose est lent" à la correction de code
Posez-lui une question. Cinq étapes plus tard, vous obtenez une correction appuyée par des preuves d'utilisateurs réels.
1. Découverte
Analyse vos données CoreDash pour trouver les pires pages et métriques. Priorise les mauvaises évaluations, le mobile, les pages à fort trafic et les scores p75 qui masquent une longue traîne de mauvaises performances.
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 par pourcentage.
3. Trace Chrome
Visite la page avec une émulation mobile. Ne trace que la phase de goulot d'étranglement de l'étape 2. Capture le network waterfall, le filmstrip et les preuves des 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. Correction ou Rapport
À vous de choisir. Appliquez la correction de code avec fichier, ligne, élément, avant/après. Générez un rapport HTML autonome avec des graphiques et des preuves. Ou les deux.
25+ dimensions : Tous les angles couverts par vos données de terrain
Ce sont les dimensions CoreDash réelles 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 de décalage Cause du décalage Timing du décalageSegments
Type d'appareil Pays Navigateur OS Connexion Type de visiteur Chemin de la pageTendances
Delta sur 7 jours Référence sur 28 jours Détection de régressionDiagnostiquer : Répartition par phase pour chaque Core Web Vitals
Pas seulement des scores. Chaque métrique est décomposée en phases à l'aide de l'attribution par utilisateur réel provenant de CoreDash.
Corriger le LCP avec l'IA : Diagnostic du Largest Contentful Paint
Répartition en 4 phases : TTFB, Load Delay, Load Time, Render Delay. Identifie la phase qui consomme la plus grande part du temps total.
Attribution des éléments : l'élément LCP exact, son type (image, texte, image d'arrière-plan, vidéo) et son état de priorité (fetchpriority, lazy loading).
Corrections typiques : ajouter une indication de préchargement, supprimer le lazy loading de l'image hero, optimiser le format de l'image, corriger un script bloquant le rendu.
Corriger l'INP avec l'IA : Diagnostic de l'Interaction to Next Paint
Répartition 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 des scripts : Long Animation Frames (LOAF) nomme le fichier JavaScript exact et la durée. Plus l'état de chargement de la page au moment de l'interaction.
Corrections typiques : yield au 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 cause : images sans dimensions, permutations de polices, contenu injecté dynamiquement, ressources chargées tardivement, animations CSS sur des propriétés de mise en page.
Multidimensionnel : compare le mobile vs desktop, les nouveaux visiteurs vs les visiteurs réguliers, les réseaux rapides vs les réseaux lents pour affiner la cause.
Corrections 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 "envisagez d'optimiser vos images". C'est 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 1 980 ms en retard car elle manque d'une indication de préchargement et n'a pas fetchpriority="high".
Preuve 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 : détérioration de +340 ms sur 7 jours.
Preuve Chrome :
Le network waterfall montre un écart de 1 940 ms entre le premier octet HTML et la requête d'image. Image référencée uniquement dans le CSS, invisible pour le scanner de préchargement.
Correction :
Ajouter <link rel="preload" href="/images/hero.jpg" as="image" fetchpriority="high"> à templates/product.html ligne 12. Définir fetchpriority="high" sur l'élément img à la ligne 47.
Conseil générique de l'IA :
"Envisagez d'ajouter fetchpriority à votre image LCP et assurez-vous d'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 de LCP dans le Load Delay (CoreDash p75). Écart de découverte de 1 940 ms (Chrome network waterfall).
Correction : Modification de code sur 2 lignes avec diff avant/après.
Comparer : Comment CWV Superpowers se positionne
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 (28 jours de données de terrain) | Session de laboratoire unique | Chargement unique simulé |
| Mesure INP | ✓ Interactions réelles | ✗ Aucun utilisateur réel | ✗ Non mesuré |
| Répartition des phases | ✓ Phases LCP, INP, CLS | ~ Analyse manuelle | ✗ Score uniquement |
| Attribution des éléments | ✓ Élément exact + priorité | ~ Si vous savez où regarder | ~ Suggestions génériques |
| Raisonnement proportionnel | ✓ Goulot d'étranglement en % | ✗ Valeurs absolues | ✗ Valeurs absolues |
| Comparaison des segments | ✓ Appareil, pays, navigateur | ✗ Configuration unique | ✗ Configuration unique |
| Détection des tendances | ✓ Delta sur 7 jours | ✗ Moment précis | ✗ Moment précis |
| Traçage Chrome | ✓ Ciblé par phase | ✓ Accès complet | ✗ Pas de navigateur |
| Corrections de code | ✓ Fichier + ligne + diff | ~ Dépendant de l'agent | ~ Conseils génériques |
Note : Chrome DevTools MCP est complémentaire. CWV Superpowers l'utilise pour un traçage ciblé après 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 en ligne.
Rapport complet (avec Chrome)
Cartes de métriques à code couleur, graphiques de répartition des phases, captures d'écran filmstrip aux moments clés (premier affichage, LCP, chargé), network waterfall SVG, analyse des causes racines et la correction recommandée avec le code avant/après.
Rapport RUM uniquement
Mêmes cartes de métriques et répartition des phases, plus l'attribution des éléments et l'analyse des causes racines. Pas de filmstrip ni de network waterfall, 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 : Skill complet 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 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
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, People Inc
"Seven brands, seven different stacks. Every single one got faster. No compromises on what makes each property unique."
Lead Developer, Alza
"Transferred knowledge to our engineering team. We can now diagnose and resolve performance issues independently."
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."
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.
CTO, DPG Media
"He found bottlenecks in our component library that we'd missed for two years. Performance gains were visible within days."
Product Lead, Miro
"Our dashboards were choking on main-thread work. 25% reduction in CPU usage. Users noticed immediately."
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."
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."
Fonctionnel en 2 Minutes
Diagnostic automatisé des Core Web Vitals dans votre terminal. Vous avez besoin d'un compte CoreDash avec des données qui circulent. Le forfait gratuit fonctionne.
Claude Code
claude mcp add --transport http coredash \
https://app.coredash.app/api/mcp \
--header "Authorization: Bearer cdk_VOTRE_CLE_API"
/plugin marketplace add corewebvitals/cwv-superpowers
/plugin install cwv-superpowers@cwv-superpowers
claude --chrome
Find my biggest CWV issue and fix it. Obtenez votre clé API sur CoreDash → Paramètres du Projet → Clés API (MCP). Affichée une 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_VOTRE_CLE_API"
}
}
}
} Autres Clients MCP
Point de terminaison : https://app.coredash.app/api/mcp
En-tête : Authorization: Bearer cdk_VOTRE_CLE_API
Fonctionne avec VS Code (mode agent Copilot), Windsurf, Gemini CLI, Claude Desktop, et tout client HTTP MCP. Un seul point de terminaison MCP pour la web performance, tous les agents.
Questions Fréquemment Posées
Ai-je besoin que Chrome soit en cours d'exécution pour utiliser CWV Superpowers ?
Non. Le traçage Chrome est facultatif. Sans lui, vous obtenez un diagnostic complet des données de terrain, des répartitions de phases, l'attribution des éléments et des suggestions de corrections de code basées uniquement sur les données CoreDash. Chrome ajoute des captures d'écran filmstrip, le network waterfall et une confirmation visuelle de la cause racine. Les deux modes génèrent des rapports.
En quoi est-ce différent d'exécuter 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 appuis réels des utilisateurs (Lighthouse ne le peut pas). Il compare des segments (mobile vs desktop, Inde vs US). Et il utilise un raisonnement proportionnel pour trouver la phase du goulot d'étranglement, pas seulement des scores absolus.
Quels agents de codage IA sont pris en charge ?
Tout agent de codage IA pour la web performance qui prend en charge les serveurs MCP (Model Context Protocol). Claude Code dispose d'un skill dédié 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 CoreDash. Les données de terrain et l'attribution sont identiques sur tous les clients.
Est-ce que CoreDash est gratuit ?
CoreDash a un forfait gratuit qui fonctionne avec CWV Superpowers. Vous devez avoir des données qui proviennent de votre site (ajoutez la balise de script CoreDash). Le forfait gratuit n'a aucun échantillonnage et aucune limite de pages vues. Les clés API pour l'accès MCP sont disponibles sur tous les forfaits.
Puis-je l'utiliser pour les sites de clients ?
Oui. Pour chaque projet CoreDash, vous pouvez créer des clés API MCP dédiées et illimitées. Ajoutez CoreDash à chaque site client, générez une clé 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 sur l'utilisation commerciale.
Open Source. Sans verrouillage.
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 rapport sont tous sur GitHub. Lisez comment ça fonctionne. Forkez-le. Étendez-le. Contribuez.
Démarrez votre essai gratuit Voir sur GitHub