Commit Graph

11 Commits

Author SHA1 Message Date
Usman Baig
ab6008daf9 fix(pagespeed): parse markdown links + handle more audit item fields
- AuditDescription: converts [text](url) to clickable links
- AuditItem: handles href, text/linkText, source.url from PSI API
2026-03-22 20:52:50 +01:00
Usman Baig
8b95620ec1 polish(pagespeed): mini gauges, animated tab switcher, filmstrip title
- Replace compact dot+number scores with 64px ScoreGauge circles
- ScoreGauge scales font/stroke/spacing for small sizes
- Add "Page Load Timeline" header to filmstrip section
- Replace pill toggle with animated underline tabs (matches dashboard)
2026-03-22 20:43:11 +01:00
Usman Baig
783530940e polish(pagespeed): design consistency pass
- Filmstrip: dark mode bg fix, consistent card padding, scroll fade
- Metrics: font-semibold to match uptime page
- Hero: tighter compact scores, smaller legend, centered alignment
- Chart: hide x-axis when single day, height matches uptime (h-40)
- Diagnostics: hide categories with zero failures, muted display values
- Skeleton: matches new hero layout
2026-03-22 20:19:07 +01:00
Usman Baig
dd0700cbea fix(pagespeed): poll silently without triggering SWR re-renders
Use direct API fetch for polling instead of mutateLatest() which was
causing the page to flicker and clear data every 5 seconds. SWR cache
is only updated once when new results arrive.
2026-03-22 19:56:00 +01:00
Usman Baig
8649f37bb9 feat(pagespeed): split diagnostics by category (Performance, Accessibility, Best Practices, SEO)
Each Lighthouse category gets its own card with failing audits sorted
by impact and collapsed passed audits. Matches pagespeed.web.dev layout.
2026-03-22 19:52:49 +01:00
Usman Baig
fcbf21b715 feat(pagespeed): render page load filmstrip between hero and metrics
Horizontal scrollable filmstrip showing page rendering progression
with timing labels. Appears between the score hero and metrics card.
2026-03-22 19:43:44 +01:00
Usman Baig
50960d0556 feat(pagespeed): render element screenshots in expandable audit items
Shows node screenshots, labels, HTML snippets, and URLs in audit
detail rows — matching pagespeed.web.dev's failing elements display.
2026-03-22 19:18:03 +01:00
Usman Baig
6b00b8b04a redesign(pagespeed): full page redesign inspired by pagespeed.web.dev
- Hero card: large performance gauge + compact inline scores + screenshot
- Single metrics card with 2x3 grid and colored status dots
- Flat diagnostics list sorted by impact with severity indicators
- ScoreGauge accepts size prop for flexible gauge sizing
- Unicode severity markers (triangle/square/circle) per audit
2026-03-22 19:10:47 +01:00
Usman Baig
b0e6db36a1 feat(pagespeed): add screenshot display and expandable diagnostics
- Page screenshot thumbnail next to score gauges
- Expandable audit rows with description and detail items table
- Shows URLs, HTML snippets, wasted bytes/ms for each failing element
- AuditRow component replaces flat diagnostic rows
2026-03-22 18:54:45 +01:00
Usman Baig
2fd9bf82f1 fix(pagespeed): poll for results after async check trigger
Backend now returns 202 immediately. Frontend polls every 5s for up
to 2 minutes until new results appear, then shows success toast.
2026-03-22 18:35:17 +01:00
Usman Baig
52906344cf feat(pagespeed): add PageSpeed page with gauges, CWV cards, chart, and diagnostics
- ScoreGauge SVG component with color-coded circular arcs
- Full page: disabled state, score overview, CWV metrics, trend chart
- Diagnostics accordion with opportunities/diagnostics/passed groups
- Mobile/desktop strategy toggle, manual check trigger
- Loading skeleton, frequency selector
2026-03-22 18:13:08 +01:00