PERFORMANCE AUDIT

LIGHTHOUSE METRICS & ANALYSIS

Comprehensive performance audit documenting Lighthouse scores, bundle sizes, and optimization strategies.

CURRENT METRICS

Latest Lighthouse scores (2026-03-25)
Lighthouse Performance Score (Home): 91%/100 ✅
Core Web Vitals (Home):
  • First Contentful Paint (FCP): 1.96s (Target: < 2.5s) ✅
  • Largest Contentful Paint (LCP): 3.16s (Target: < 4s) ✅
  • Total Blocking Time (TBT): 17ms (Target: < 350ms) ✅
  • Cumulative Layout Shift (CLS): 0.05 (Target: < 0.25) ✅
Bundle Sizes (Initial Load):
  • JavaScript: 61.46 KB (gzipped)
  • CSS: 14.00 KB (gzipped)
  • Total: 61.46 KB (gzipped)
Last Updated: 2026-03-25T17:45:00.000Z

OPTIMIZATION STRATEGIES

How we achieved these scores
1. Font Loading Optimization (2025-11-11):
  • Consolidated 7 separate font imports into 1 combined URL
  • Added dns-prefetch and preconnect for Google Fonts
  • Added CSS preloading with <link rel="preload">
  • Maintained display=swap for better perceived performance
  • Impact: FCP -80ms (-3.4%), LCP -50ms (-1.6%)
2. CSS Optimization:
  • Comprehensive print stylesheet
  • Tailwind purge configuration
  • Consolidated font imports
  • Result: 14.00 KB gzipped (down from 17 KB)
3. JavaScript Optimization:
  • Code splitting with lazy loading (~30 route chunks)
  • Tree shaking to remove unused code
  • Production minification with esbuild
  • Result: 61.46 KB gzipped main bundle
4. Build Process:
  • Implemented --clean flag to prevent artifact accumulation
  • Optimized HTML template generation
  • Resource hints for critical assets
5. Image Optimization:
  • Inline SVGs for critical graphics (FYT logo)
  • No raster images (0 KB image payload)
  • Lazy loading ready for future images

PERFORMANCE TARGETS

Goals and achievements
MetricTargetCurrentStatus
Total Bundle (gz)< 100 KB61.46 KB✅ **PASS**
CSS Size (gz)< 15 KB14.00 KB✅ **PASS**
JS Size (gz)< 70 KB61.46 KB✅ **PASS**
FCP< 2.5s1.96s✅ **PASS**
LCP< 4.0s3.16s✅ **PASS**
TBT< 350ms17ms✅ **PASS**
CLS< 0.250.05✅ **PASS**
Lighthouse (Home)≥ 9091%✅ **PASS**
All targets met as of 2026-03-25! 🎉

TESTING & VERIFICATION

How to run performance audits
Run Lighthouse Locally:
BASH
npm run lighthouse:build
Run Lighthouse CI:
BASH
npm run lighthouse:ci
Check Bundle Sizes:
BASH
npm run build
Configuration:
  • Lighthouse config: lighthouserc.json
  • Assertions ensure performance doesn't regress
  • CI integration for automated testing

CONTINUOUS IMPROVEMENT

Ongoing optimization efforts
Recent Improvements (2025-11-11):
  • ✅ Font loading optimization (consolidated imports, preloading)
  • ✅ Resource hints (dns-prefetch, preconnect)
  • ✅ Build process cleanup (--clean flag)
  • ✅ CSS optimization (17 KB → 13 KB gzipped)
  • ✅ Performance score: 90% → 91%
  • ✅ FCP improvement: 2.36s → 2.28s (-80ms)
  • ✅ LCP improvement: 3.11s → 3.06s (-50ms)
Previous Improvements:
  • ✅ Font optimization (removed 6 unused fonts)
  • ✅ CSS purge (eliminated 91.6% waste)
  • ✅ Code splitting (lazy-loaded components)
  • ✅ Print stylesheet optimization
Future Opportunities:
  • Self-host fonts (eliminate CDN latency, ~200-300ms LCP improvement)
  • Critical CSS extraction (inline above-the-fold styles)
  • Service worker for caching (offline support)
  • HTTP/2 server push (push critical assets)
  • Font subsetting (reduce font file sizes)
← BACK TO DOCUMENTATION INDEX