Lazy-Loading Three.js for a 90+ Lighthouse Score

Three.js is powerful but heavy. Here's how I keep it from tanking performance.

Code-split the bundle

Use Vite's manualChunks to isolate Three.js into its own chunk.

Load on idle, only when needed

Dynamically import() the WebGL module during requestIdleCallback, and skip it entirely on low-power devices or when prefers-reduced-motion is set.

The result: a light initial bundle and a buttery hero on capable devices.