optimize fallback component bundle size with code splitting

[FradSer]

Summary

The WebXR fallback components contain large static arrays and complex 3D scenes that increase the main bundle size. Implement code splitting to load fallback components only when needed.

Current State

• Fallback3D/Scene.tsx contains large static arrays (FLOATING_SHAPES, TEXT_PLANES, etc.)
• All fallback components are currently bundled with main WebXR code
• Bundle size impact affects initial page load even when fallbacks aren't needed

Bundle Size Impact

// Current large static arrays
const FLOATING_SHAPES = [/* 3 complex shape definitions */]
const TEXT_PLANES = [/* 7 text plane definitions */] 
const PLATFORM_ELEMENTS = [/* 3 platform definitions */]
const QUALITY_CONFIGS = {/* 3 quality levels with configs */}

Proposed Solutions

1. Extract Constants to Separate Files

// utils/webxr/fallbackConstants.ts
export const FLOATING_SHAPES = [/* moved from Scene.tsx */]
export const TEXT_PLANES = [/* moved from Scene.tsx */]
export const PLATFORM_ELEMENTS = [/* moved from Scene.tsx */]

2. Implement Lazy Loading for Fallback Components

// Enhanced dynamic imports in WebXR/page.tsx
const Fallback3DScene = dynamic(
  () => import('@/components/WebXR/Fallback3D/Scene'),
  { ssr: false, loading: () => <FallbackLoadingSpinner /> }
)

// Only load when fallback is actually needed
const WebXR3DErrorBoundary = dynamic(
  () => import('@/components/WebXR/WebXR3DErrorBoundary'),
  { ssr: false }
)

3. Progressive Loading Strategy

• Load minimal fallback first (simple error message)
• Lazy load 3D fallback components when WebGL is detected but WebXR fails
• Load 2D fallback as final resort

Files to Update

• components/WebXR/Fallback3D/Scene.tsx
• utils/webxr/fallbackConstants.ts (new file)
• components/WebXR/WebXR3DErrorBoundary.tsx
• Update dynamic imports in app/webxr/page.tsx

Expected Benefits

• Reduced main bundle size
• Faster initial page load
• Fallback components loaded only when needed
• Better Core Web Vitals scores

Acceptance Criteria

• [ ] Large static arrays moved to separate constants file
• [ ] Fallback components use dynamic imports
• [ ] Bundle analyzer shows reduced main bundle size
• [ ] Progressive loading works correctly in error scenarios
• [ ] No regression in fallback functionality