Primera versión estable
Un dashboard de auditoría de rendimiento nativo de Laravel, construido sobre Livewire 4 + Flux Free 2 + Tailwind 4, con soporte completo para Laravel 11 / 12 / 13.
Drivers de auditoría
- · Auditorías Lighthouse con cuatro drivers intercambiables (local, playwright, pagespeed, stub). Cada uno devuelve puntuaciones de Rendimiento / Accesibilidad / Buenas prácticas / SEO más valores de métricas en bruto (LCP, INP, CLS, TTFB, FCP, TBT, Speed Index).
- · Telemetría backend — número de consultas, tiempo de consulta, sospecha N+1, memoria máxima, vistas renderizadas, jobs despachados, eventos disparados, hits/misses de caché. Muestreado mediante una cabecera X-Vitals-Audit-Id firmada para no afectar nunca al tráfico de producción.
- · Análisis de código — escáneres estáticos adjuntan referencias exactas archivo:línea a los hallazgos de Lighthouse leyendo vistas Blade, configuración de Vite y composer.json.
Interfaces
- · /vitals — vista general con instantánea de salud y tendencias sparkline para todas las URLs monitorizadas.
- · /vitals/urls y /vitals/urls/{id} — detalle por URL con historial de auditorías, puntuaciones promedio, filtro de período y alternador de métricas.
- · /vitals/audits/{id} — detalle completo de auditoría con medidores de puntuación, tarjetas Core Web Vitals, desglose frontend ↔ backend, recomendaciones con color según gravedad.
- · /vitals/issues — principales problemas, regresiones y todas las recomendaciones agrupadas por clave de auditoría.
- · /vitals/seo — vista SEO multi-URL con desglose de comprobaciones personalizadas, comprobaciones más fallidas y filtro de categoría.
- · /vitals/rum — Real User Monitoring con atribución INP (elemento + tipo de evento).
- · /vitals/queries — baselines de consultas por ruta con detección N+1 y patrones SQL repetidos.
- · /vitals/learn — base de conocimiento de cada problema detectable, navegable por categoría con fragmentos de código.
- · /vitals/budgets — umbrales por métrica con historial de violaciones.
- · Spotlight (Cmd/Ctrl+K) — búsqueda global entre auditorías, URLs, recomendaciones y entradas learn.
Subsistema de comprobaciones SEO
- · 22 comprobaciones alineadas con las mejores prácticas de Google 2026 — Configuración (3), Contenido (5), Metadatos (7), Rendimiento (7).
- · El accessor Audit::vitals_seo_score mezcla el SEO de Lighthouse (50%) con la tasa de aprobación ponderada de las comprobaciones personalizadas (50%), produciendo una puntuación más estricta de 0 a 100.
Real User Monitoring
- · Directiva Blade @vitalsRum — ligera (~11 KB, gzip ~4 KB), usa web-vitals v4 con datos de atribución.
- · Respetuosa con la privacidad: sin almacenamiento de IPs, sin fingerprinting.
- · Atribución INP: extrae el selector objetivo + tipo de evento de la interacción más lenta para que corrijas el elemento correcto.
Ergonomía del desarrollador
- · Abrir en editor — 11 presets de editores (VSCode, Cursor, PHPStorm, IntelliJ IDEA, Sublime Text, Atom, TextMate, MacVim, Emacs, Nova, Zed). Plantillas personalizadas via VITALS_EDITOR_URL_TEMPLATE.
- · API JSON v1 — /vitals/api/v1/{audits,urls,recommendations} con paginación, filtrado por fecha y acceso protegido por la Gate viewVitals.
- · Seeder de demo — php artisan vitals:demo rellena datos sintéticos para que el dashboard sea explorable antes de ejecutar auditorías reales.
Notificaciones
- · Canales de email + Slack para los eventos Regresión detectada y Presupuesto violado.
- · Los mensajes de Slack se organizan en hilos por URL — las regresiones posteriores responden al mensaje original.
i18n
- · Interfaz completa en EN, FR, DE, ES — ~1 100 cadenas de traducción en páginas, componentes, recomendaciones, títulos/descripciones/pistas de comprobaciones SEO y tooltips.
Tema
- · Paleta OKLCH nativa con acento rosa y escala de grises neutrales teñidos.
- · Geist Sans + Geist Mono auto-alojados via @fontsource-variable.
- · Modo claro + oscuro controlado por una clase .dark en <html>, persistido mediante el botón de la barra de navegación.
Tests
- · 550+ pruebas Pest (unit + feature + integration) que cubren pipelines de auditoría, comprobaciones SEO, componentes Livewire, API JSON, notificaciones, captura de telemetría y evaluación de presupuestos. PHPStan nivel max, sin baseline.