Performance Budgets & Build Footprint
Every feature on this portfolio is engineered against strict performance budgets. Figures on this page are labelled with whether they were actually observed: the build footprint comes from the production build output, while the Core Web Vitals entries are declared budgets that no committed tool has yet verified.
Live Client Hardware & WebGL Runtime Diagnostics
Runtime Experience & Performance Selector
Control GPU acceleration and data usage across the entire portfolio in real time.
📊 Core Web Vitals Budgets & Measured Build Footprint
First Load JS (shared by all routes)
Critical shared chunks loaded upfront; Three.js and heavy canvas libraries are dynamically code-split out of the shared bundle.
First Load JS (home route)
Home route total including the deferred 3D scene bundle. Within the 200 kB production budget.
Prerendered static pages
Every route is generated at build time and served as static HTML; no server render happens per request.
First Contentful Paint (FCP)
Budget for first paint of the static shell from an edge cache. Not yet confirmed by a committed Lighthouse run.
Largest Contentful Paint (LCP)
Budget for the hero text and static 3D fallback. Not yet confirmed by a committed Lighthouse run.
Cumulative Layout Shift (CLS)
Budget. Fixed-height canvas aspect ratios are intended to prevent reflow during hydration, but the shift score has not been measured.
Interaction to Next Paint (INP)
Budget. INP is a field metric, so it requires real-user monitoring rather than a synthetic profile; no such measurement exists here.
Lighthouse Accessibility
Budget. Note the repo axe suite covers 3 routes and disables the color-contrast rule, so no current test substantiates this score.
Lighthouse Best Practices
Budget. Security headers are declared in public/_headers, but no run scores them.
WebGL Framerate (Desktop)
Budget. The R3F loop uses a delta-clamped requestAnimationFrame; no in-engine FPS telemetry is collected or reported.
Engineering Mode Matrix & Resource Allocation
| Subsystem Feature | Immersive Mode | Balanced Mode | Low-Bandwidth Mode |
|---|---|---|---|
| 3D Neural Core & Starfield | 5,001 active WebGL particles (2.0 DPR) | 1,200 WebGL particles (1.0 DPR clamped) | Disabled (Pure lightweight CSS glow mesh) |
| 3D CyberBot Companion | Full 3D WebGL chassis, ion physics & gaze | Low-poly mode with reduced shadow passes | Disabled (Instant static HUD avatar) |
| Audio Chimes & Sound Synthesis | Web Audio API cyber chimes active | Muted by default (opt-in on click) | Disabled completely |
| Initial Data Payload | ~380 KB (with 3D WebGL bundle) | ~220 KB (optimized assets) | < 80 KB (instant content-first delivery) |
| Device Target | Modern Desktop & GPUs (M1+, RTX, Core i5+) | Tablets, Laptops on battery saver | Mobile data, 3G connections, low-power phones |