fix(refboard): prevent WebGL OOM on large scenes

- Skip thumbnail generation when scene has >50 items (extract.canvas
  on full viewport with many textures causes GPU OOM and context loss)
- Add WebGL context lost/restored handlers — auto-reload scene on recovery
- Reduce texture memory budget from 512MB to 256MB for GPU headroom
This commit is contained in:
Hiren Kangad
2026-03-10 10:45:14 +05:30
parent a2eea8f22f
commit 451ec339a5
3 changed files with 31 additions and 3 deletions
+25
View File
@@ -224,6 +224,24 @@ const PixiCanvas = forwardRef<PixiCanvasHandle, PixiCanvasProps>(
// Store observer for cleanup
(container as any).__pixiRO = ro;
// -- WebGL context loss recovery ------------------------------------
const canvas = app.canvas as HTMLCanvasElement;
const onContextLost = (e: Event) => {
e.preventDefault(); // allows context to be restored
console.warn('[PixiCanvas] WebGL context lost — waiting for restore');
};
const onContextRestored = () => {
console.warn('[PixiCanvas] WebGL context restored — reloading scene');
// Re-load scene data so textures get re-uploaded to GPU
if (sceneRef.current && initialLoadDone.current) {
const data = sceneRef.current.serialize();
sceneRef.current.loadScene(data, false);
}
};
canvas.addEventListener('webglcontextlost', onContextLost);
canvas.addEventListener('webglcontextrestored', onContextRestored);
(container as any).__pixiContextHandlers = { onContextLost, onContextRestored, canvas };
// Signal that PixiJS is ready for scene loading
setPixiReady(true);
@@ -254,6 +272,13 @@ const PixiCanvas = forwardRef<PixiCanvasHandle, PixiCanvasProps>(
delete (container as any).__pixiWheelHandler;
}
const ctxHandlers = (container as any).__pixiContextHandlers;
if (ctxHandlers) {
ctxHandlers.canvas.removeEventListener('webglcontextlost', ctxHandlers.onContextLost);
ctxHandlers.canvas.removeEventListener('webglcontextrestored', ctxHandlers.onContextRestored);
delete (container as any).__pixiContextHandlers;
}
textures.clear();
if (appRef.current) {