add object pooling for three.js vector allocations

[FradSer]

Summary

Optimize WebXR animation performance by implementing object pooling for frequently allocated Three.js Vector3 objects to reduce garbage collection pressure.

Current State

• CameraController3D creates tempVector with useMemo (good start)
• Other components may be creating vectors in render loops
• Frequent vector allocations can cause GC pauses during animations

Performance Impact

• Reduced garbage collection during animations
• More consistent frame rates in WebXR mode
• Better memory management for long-running sessions

Implementation Plan

1. Create Vector Pool Utility

// utils/objectPool.ts
class VectorPool {
  private pool: THREE.Vector3[] = []
  private maxSize: number
  
  constructor(maxSize = 50) {
    this.maxSize = maxSize
    // Pre-populate pool
    for (let i = 0; i < Math.min(10, maxSize); i++) {
      this.pool.push(new THREE.Vector3())
    }
  }
  
  acquire(): THREE.Vector3 {
    return this.pool.pop() || new THREE.Vector3()
  }
  
  release(vector: THREE.Vector3): void {
    if (this.pool.length < this.maxSize) {
      vector.set(0, 0, 0) // Reset
      this.pool.push(vector)
    }
  }
}

2. Update Animation Components

• CameraController3D
• WorkCard3D animation logic
• HeroText fade animations

Files to Update

• Create utils/objectPool.ts
• components/WebXR/CameraController3D/index.tsx
• components/WebXR/WorkCard3D/index.tsx
• Other components using frequent vector allocations

Acceptance Criteria

• [ ] Vector pool utility created with acquire/release pattern
• [ ] Updated components to use pooled vectors
• [ ] Performance testing shows reduced GC pressure
• [ ] No memory leaks in long-running sessions