WebGL foundation

Когда использовать

Integrate a Three.js scene as progressive enhancement.

Решения для реализации

1. Create one renderer per active canvas and cap DPR at 1.5–2.
2. Use ResizeObserver and synchronize camera aspect.
3. Use setAnimationLoop and suspend rendering when hidden or offscreen.
4. Dispose geometries, materials, textures, observers and renderer. Show a fallback on WebGL context loss.

Как проверить результат

• Repeated mounts do not leak loops.
• WebGL failure leaves useful content.
• Page content precedes Three.js loading.

Работающий пример

Файлы