Tu agente de IA acaba de obtener superpoderes de Core Web Vitals
Conecta Claude Code a tus datos de campo de CoreDash. Encuentra tu peor cuello de botella a través de millones de cargas de página, rastrea la causa raíz en Chrome y escribe la solución. Rendimiento web agéntico — no un informe, sino la línea de código exacta que necesita cambiar.
Instalar en 2 minutos Comenzar prueba gratuita de CoreDash »Trusted by market leaders · Client results
Las herramientas de rendimiento de IA tienen un problema de datos
La mayoría de los agentes de IA optimizan para Lighthouse. Una puntuación sintética en un dispositivo simulado que Google no utiliza para el posicionamiento. Un agente de IA de rendimiento web útil parte de los mismos datos que Google: usuarios reales en teléfonos económicos, conexiones inestables y continentes que tu máquina de desarrollo nunca ha visto.
Lighthouse no es tu señal de posicionamiento
Google clasifica según datos de campo de CrUX de usuarios reales de Chrome durante 28 días. Una puntuación perfecta en Lighthouse y una puntuación de campo deficiente suceden todo el tiempo. El 52% de los sitios móviles fallan al menos un Core Web Vital en el campo.
Los agentes ciegos hacen correcciones ciegas
Sin datos de usuarios reales, un agente de IA no sabe qué página es lenta, qué elemento es el cuello de botella o si su solución ayudó. Optimiza una simulación y da el día por terminado. Tus usuarios reales no están de acuerdo.
La investigación manual lleva horas
Segmenta los datos. Haz hipótesis. Ejecuta un rastreo. Confirma. Redacta la solución. Un ingeniero de rendimiento senior dedica de 2 a 4 horas por problema. Multiplica eso por cada página lenta de tu sitio.
El INP no se puede simular en un laboratorio en absoluto Interaction to Next Paint mide cómo interactúan los usuarios reales con tu página. Ninguna herramienta sintética puede replicar el comportamiento de un usuario real: dónde toca, qué tan rápido se desplaza, qué dispositivo sostiene. Lighthouse ni siquiera informa el INP. Si tu agente de IA ejecuta Lighthouse, es ciego a tus peores problemas de interactividad. Los datos de campo son la única fuente.
Dos fuentes de verdad: Los datos de campo se encuentran con la evidencia del navegador
CWV Superpowers combina datos de usuarios reales de CoreDash con rastreos dirigidos en Chrome. Los datos de campo le dicen qué es lento. Chrome le dice por qué.
CoreDash le dice al agente qué es lento
CoreDash rastrea cada carga de página de cada usuario real. Cada métrica, atribuida al elemento exacto que causa el problema. Sin muestreo, sin límites.
Cuando CoreDash reporta un LCP de 4.2 segundos con un Load Delay que consume el 52% del tiempo total en div.hero > img.main, el agente sabe exactamente dónde mirar. No es una suposición. Es una medición de millones de sesiones reales.
La skill consulta más de 25 dimensiones de CoreDash: elemento de LCP, tipo de elemento, estado de prioridad, desglose por fases, objetivo de interacción de INP, scripts de LOAF, elemento de cambio de CLS, tipo de dispositivo, tipo de visitante, velocidad de red, tendencias de 7 días.
Chrome le dice al agente por qué es lento
CWV Superpowers visita la página con emulación móvil: Fast 3G, limitación de CPU de 4x. Rastrea solo la fase del cuello de botella que CoreDash identificó.
¿Load Delay es el cuello de botella? El agente examina la cascada de red en busca de brechas de descubrimiento. ¿Render Delay? Busca scripts bloqueantes y retrasos en la carga de fuentes.
El resultado: capturas de pantalla en tira de imágenes (filmstrip), cascada de red y evidencia dirigida que explica la causa raíz que expusieron tus datos de campo.
Razonamiento proporcional, no umbrales absolutos
Lighthouse te dice "Render Delay es de 350ms". ¿Es ese el problema? Ni idea. CWV Superpowers identifica el cuello de botella como la fase que consume el mayor porcentaje del tiempo total.
El INP es de 350ms. Input Delay 70ms (20%), Processing 80ms (23%), Presentation 200ms (57%). Presentation es el cuello de botella, a pesar de que 200ms suena bien de forma aislada. Solucionarlo marca la diferencia. Optimizar el Input Delay apenas se nota.
Esto previene el error más común en el trabajo de rendimiento: arreglar lo incorrecto.
Cinco pasos: De "algo es lento" a la corrección del código
Hazle una pregunta. Cinco pasos después tienes una solución respaldada por evidencia de usuarios reales.
1. Descubrimiento
Escanea tus datos de CoreDash en busca de las peores páginas y métricas. Prioriza las calificaciones deficientes, móviles, páginas de alto tráfico y puntuaciones del percentil 75 (p75) que ocultan una larga cola de rendimiento deficiente.
2. Diagnóstico
Desglosa la métrica en fases. LCP: TTFB, Load Delay, Load Time, Render Delay. INP: Input Delay, Processing, Presentation. Nombra el cuello de botella por porcentaje.
3. Rastreo de Chrome
Visita la página con emulación móvil. Rastrea solo la fase del cuello de botella del paso 2. Captura la cascada de red, la tira de imágenes y la evidencia de recursos bloqueantes.
4. Causa Raíz
Combina ambas fuentes de evidencia en una sola declaración: el elemento, la causa, las métricas de CoreDash y lo que Chrome confirmó. Sin ambigüedad.
5. Corrección o Informe
Tu elección. Aplica la corrección de código con archivo, línea, elemento, antes/después. Genera un informe HTML autónomo con gráficos y evidencia. O ambos.
Más de 25 dimensiones: Cada ángulo que cubren tus datos de campo
Estas son las dimensiones reales de CoreDash que el agente consulta. No un resumen. La imagen completa.
LCP (Largest Contentful Paint)
Elemento LCP Tipo de elemento Estado de prioridad Fase TTFB Load Delay Load Time Render DelayINP (Interaction to Next Paint)
Objetivo de INP Input Delay Processing Presentation Scripts de LOAF Estado de cargaCLS (Cumulative Layout Shift)
Elemento de desplazamiento Causa del desplazamiento Momento del desplazamientoSegmentos
Tipo de dispositivo País Navegador Sistema operativo Conexión Tipo de visitante Ruta de la páginaTendencias
Diferencia de 7 días Línea base de 28 días Detección de regresionesDiagnosticar: Desglose a nivel de fase para cada Core Web Vital
No solo puntuaciones. Cada métrica desglosada en fases usando la atribución de usuarios reales de CoreDash.
Solucionar LCP con IA: Diagnóstico de Largest Contentful Paint
Desglose de 4 fases: TTFB, Load Delay, Load Time, Render Delay. Identifica qué fase consume la mayor parte del tiempo total.
Atribución de elementos: el elemento LCP exacto, su tipo (imagen, texto, imagen de fondo, video) y el estado de prioridad (fetchpriority, carga diferida o lazy loading).
Correcciones típicas: agregar sugerencia de precarga (preload hint), eliminar carga diferida del hero, optimizar el formato de imagen, arreglar script que bloquea el renderizado.
Solucionar INP con IA: Diagnóstico de Interaction to Next Paint
Desglose de 3 fases: Input Delay, Processing, Presentation. La única métrica que no puedes simular en un laboratorio. Los datos de campo son la única fuente.
Atribución de scripts: Long Animation Frames (LOAF) nombra el archivo de JavaScript exacto y su duración. Además del estado de carga de la página cuando ocurrió la interacción.
Correcciones típicas: ceder el control (yield) al hilo principal, posponer la evaluación, dividir los manejadores de eventos, content-visibility para DOMs grandes.
CLS: Cumulative Layout Shift
5 patrones de causa: imágenes sin dimensiones, intercambio de fuentes (font swaps), contenido inyectado dinámicamente, recursos de carga tardía, animaciones CSS en propiedades de diseño (layout).
Multidimensional: compara móvil contra escritorio, visitantes nuevos contra recurrentes, redes rápidas contra lentas para acotar la causa.
Correcciones típicas: agregar width/height, font-display: optional, reserva de min-height, usar transform en lugar de top/left.
Cómo se ve una declaración de causa raíz
No "considera optimizar tus imágenes". Este es el resultado real. Lo suficientemente específico para revisar e integrar (merge).
Causa raíz:
La imagen LCP div.hero-banner > img.product-main en /product/running-shoes-42 se descubre 1,980ms tarde porque carece de una sugerencia de precarga (preload hint) y no tiene fetchpriority="high".
Evidencia de CoreDash:
El LCP es de 3,820ms (deficiente) en móvil, p75. Load Delay es el cuello de botella con 1,980ms (52% del total). Estado de prioridad: 3 (no precargado). Tendencia: empeorando +340ms en 7 días.
Evidencia de Chrome:
La cascada de red muestra una brecha de 1,940ms entre el primer byte de HTML y la solicitud de la imagen. La imagen solo está referenciada en CSS, invisible para el escáner de precarga (preload scanner).
Solución:
Añade <link rel="preload" href="/images/hero.jpg" as="image" fetchpriority="high"> a templates/product.html línea 12. Establece fetchpriority="high" en el elemento img en la línea 47.
Consejo genérico de IA:
"Considera agregar fetchpriority a tu imagen LCP y asegura la precarga adecuada de recursos críticos."
CWV Superpowers:
Elemento: div.hero-banner > img.product-main
Archivo: templates/product.html, línea 47
Evidencia: 52% del tiempo de LCP en Load Delay (CoreDash p75). Brecha de descubrimiento de 1,940ms (cascada de Chrome).
Solución: Cambio de código de 2 líneas con diferencias (diff) de antes/después.
Comparar: Cómo se compara CWV Superpowers
Diferentes herramientas resuelven diferentes problemas. Esto es lo que realmente hace cada una.
| Capacidad | CoreDash + CWV Superpowers | Chrome DevTools MCP | PSI / Lighthouse MCP |
|---|---|---|---|
| Fuente de datos | Usuarios reales (datos de campo de 28 días) | Sesión única de laboratorio | Carga única simulada |
| Medición de INP | ✓ Interacciones reales | ✗ Sin usuarios reales | ✗ No medido |
| Desglose de fases | ✓ Fases de LCP, INP, CLS | ~ Análisis manual | ✗ Solo puntuación |
| Atribución de elementos | ✓ Elemento exacto + prioridad | ~ Si sabes dónde buscar | ~ Sugerencias genéricas |
| Razonamiento proporcional | ✓ Cuello de botella por % | ✗ Valores absolutos | ✗ Valores absolutos |
| Comparación de segmentos | ✓ Dispositivo, país, navegador | ✗ Configuración única | ✗ Configuración única |
| Detección de tendencias | ✓ Diferencia de 7 días | ✗ Punto en el tiempo | ✗ Punto en el tiempo |
| Rastreo de Chrome | ✓ Dirigido por fase | ✓ Acceso total | ✗ Sin navegador |
| Correcciones de código | ✓ Archivo + línea + diff | ~ Depende del agente | ~ Consejo genérico |
Nota: Chrome DevTools MCP es complementario. CWV Superpowers lo utiliza para el rastreo dirigido una vez que los datos de campo identifican el cuello de botella. Funcionan mejor juntos.
Informes: Suéltalos en Slack, adjúntalos a Jira
HTML autónomo. Sin dependencias. Sin paso de compilación. Un archivo con todo en línea (inline).
Informe completo (con Chrome)
Tarjetas de métricas codificadas por colores, gráficos de desglose de fases, capturas de pantalla de la tira de imágenes (filmstrip) en momentos clave (first paint, LCP, loaded), SVG de la cascada de red, análisis de causa raíz y la solución recomendada con código antes/después.
Informe solo RUM
Las mismas tarjetas de métricas y desglose de fases, además de la atribución de elementos y el análisis de causa raíz. Sin tira de imágenes ni cascada, pero la calidad del diagnóstico es idéntica porque los datos de campo son la fuente de verdad.
Funciona con cualquier cliente MCP
Claude Code: Skill completa con flujo de trabajo automatizado. Descubrimiento, diagnóstico, rastreo de Chrome, correcciones de código e informes. Recomendado.
Cursor: Instalación de plugin con CoreDash MCP. Diagnóstico completo y correcciones de código dentro de tu editor.
VS Code, Windsurf, Gemini CLI: Cualquier cliente que soporte servidores MCP HTTP se conecta a CoreDash. Los mismos datos de campo, la misma atribución.
Client Success
Don't just take my word for it
VP Engineering, Loop
"Mobile load time down 800ms. 7% lift in checkout conversion. The ROI justified the investment immediately."
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 Digital, Rituals
"We used to break performance every other sprint. He set up budgets in our pipeline. Haven't had a regression since."
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, 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."
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.
Funcionando en 2 minutos
Diagnóstico automatizado de Core Web Vitals en tu terminal. Necesitas una cuenta de CoreDash con flujo de datos. El nivel gratuito funciona.
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
Find my biggest CWV issue and fix it. Obtén tu clave de API desde CoreDash → Configuración del proyecto → Claves de API (MCP). Se muestra una vez. Se almacena como hash SHA-256. Solo lectura.
Cursor
/plugin-add cwv-superpowers
Añade CoreDash a .cursor/mcp.json:
{
"mcpServers": {
"coredash": {
"url": "https://app.coredash.app/api/mcp",
"headers": {
"Authorization": "Bearer cdk_YOUR_API_KEY"
}
}
}
} Otros clientes MCP
Endpoint: https://app.coredash.app/api/mcp
Header: Authorization: Bearer cdk_YOUR_API_KEY
Funciona con VS Code (modo de agente Copilot), Windsurf, Gemini CLI, Claude Desktop y cualquier cliente MCP HTTP. Un endpoint de rendimiento web MCP, todos los agentes.
Preguntas Frecuentes
¿Necesito tener Chrome ejecutándose para usar CWV Superpowers?
No. El rastreo de Chrome es opcional. Sin él, obtienes un diagnóstico completo de datos de campo, desgloses de fases, atribución de elementos y sugerencias de corrección de código basadas únicamente en los datos de CoreDash. Chrome añade capturas de pantalla de la tira de imágenes, la cascada de red y la confirmación visual de la causa raíz. Ambos modos generan informes.
¿En qué se diferencia esto de ejecutar Lighthouse en mi agente de IA?
Lighthouse ejecuta una sola carga sintética en tu máquina. CWV Superpowers utiliza 28 días de datos de usuarios reales de CoreDash: dispositivos reales, redes reales, interacciones reales. Mide el INP a partir de toques reales de usuarios (Lighthouse no puede). Compara segmentos (móvil frente a escritorio, India frente a EE. UU.). Y utiliza el razonamiento proporcional para encontrar la fase del cuello de botella, no solo puntuaciones absolutas.
¿Qué agentes de codificación de IA son compatibles?
Cualquier agente de codificación de IA para rendimiento web que soporte servidores MCP (Model Context Protocol). Claude Code tiene una skill dedicada con un flujo de trabajo automatizado de 5 pasos. Cursor, VS Code (modo de agente Copilot), Windsurf, Gemini CLI y Claude Desktop se conectan a través del endpoint HTTP MCP de CoreDash. Los datos de campo y la atribución son idénticos en todos los clientes.
¿CoreDash es gratuito?
CoreDash tiene un nivel gratuito que funciona con CWV Superpowers. Necesitas tener flujo de datos desde tu sitio (agrega la etiqueta de script de CoreDash). El nivel gratuito no tiene muestreo ni límites de visualización de páginas. Las claves de API para acceso MCP están disponibles en todos los planes.
¿Puedo usar esto para sitios de clientes?
Sí. Para cada proyecto de CoreDash puedes crear claves de API dedicadas ilimitadas. Agrega CoreDash a cada sitio de cliente, genera una clave de API de solo lectura y configura tu cliente MCP. El agente solo ve los datos para ese proyecto. CWV Superpowers tiene licencia MIT, por lo que no hay restricciones en el uso comercial.
De código abierto. Sin dependencia (No Lock-in).
Automatización de Core Web Vitals que puedes inspeccionar y ampliar. El orquestador, los módulos de diagnóstico, la lógica de rastreo de Chrome y las plantillas de informes están todos en GitHub. Lee cómo funciona. Haz un fork. Amplíalo. Contribuye.
Comienza tu prueba gratuita Ver en GitHub