Add staged loading with lightweight intro scene and perf preferences

[alexwelcing]

Motivation

• Improve perceived load by showing a low‑poly lightweight intro immediately and swapping to the full scene once core assets are ready.
• Stream and prioritize 3D assets so critical pieces (background, camera path, tablet) load first and heavier content loads in background.
• Make the cinematic skippable and allow it to prefetch deeper scene assets while playing to reduce blocking time.
• Respect user device constraints by honoring prefers-reduced-motion and reduced‑data signals to downshift quality and timing.

Description

• Added a simple staged asset runner lib/perf/assetQueue.ts to run prioritized asset stages and tasks.
• Introduced a performance hook lib/hooks/usePerfPreferences.ts exposing prefersReducedMotion and prefersReducedData to centralize device preferences.
• Updated components/CinematicIntro.tsx to start immediately, accept onStart and durationScale props, and tighten/scale cinematic timings for fast startup.
• Reworked components/ThreeSixty.tsx to add initialSceneReady/fullSceneReady gates, run a core/deep asset queue, render a low‑poly LightweightIntroScene while the full scene streams, respect perf prefs for DPR and features, and add loading overlays; also made pages/index.tsx show StylishFallback until currentImage is available.

Testing

• Started the Next.js dev server with npm run dev and the server reported ready (succeeded).
• Attempted an automated Playwright script to open the page and capture a screenshot which failed with net::ERR_CONNECTION_REFUSED (failed).
• No unit or integration test suites were executed as part of this rollout (not run).

---

Codex Task

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Review	Updated (UTC)
next-docs-search	Error		Dec 20, 2025 7:30pm