src/pages/editor/page.tsx

@@ -15,6 +15,7 @@ import {
   type SceneLoadingChangeHandler,
   type SceneLoadingState,
 } from "@/types/world/sceneLoading";
+import { logger } from "@/utils/core/Logger";
 
 const SAVE_ERROR_MESSAGE = "Erreur lors de l'enregistrement";
 
@@ -243,8 +244,27 @@ export function EditorPage(): React.JSX.Element {
       <Canvas
         camera={{ position: [0, 50, 100], fov: 50 }}
         style={{ width: "100%", height: "100%" }}
+        gl={{
+          powerPreference: "high-performance",
+          antialias: true,
+          stencil: false,
+        }}
         onCreated={({ gl }) => {
           gl.setClearColor("#050505");
+
+          const canvas = gl.domElement;
+          const handleContextLost = (event: Event) => {
+            event.preventDefault();
+            logger.error("WebGL", "Context lost - GPU resources exhausted");
+          };
+          const handleContextRestored = () => {
+            logger.info("WebGL", "Context restored");
+          };
+          canvas.addEventListener("webglcontextlost", handleContextLost);
+          canvas.addEventListener(
+            "webglcontextrestored",
+            handleContextRestored,
+          );
         }}
       >
         <EditorSceneLoadingTracker

src/pages/page.tsx

@@ -12,6 +12,7 @@ import {
   INITIAL_SCENE_LOADING_STATE,
   type SceneLoadingState,
 } from "@/types/world/sceneLoading";
+import { logger } from "@/utils/core/Logger";
 import { World } from "@/world/World";
 
 export function HomePage(): React.JSX.Element {
@@ -51,11 +52,36 @@ export function HomePage(): React.JSX.Element {
     [],
   );
 
+  const handleCanvasCreated = useCallback(
+    ({ gl }: { gl: THREE.WebGLRenderer }) => {
+      const canvas = gl.domElement;
+
+      const handleContextLost = (event: Event) => {
+        event.preventDefault();
+        logger.error("WebGL", "Context lost - GPU resources exhausted");
+      };
+
+      const handleContextRestored = () => {
+        logger.info("WebGL", "Context restored");
+      };
+
+      canvas.addEventListener("webglcontextlost", handleContextLost);
+      canvas.addEventListener("webglcontextrestored", handleContextRestored);
+    },
+    [],
+  );
+
   return (
     <HandTrackingProvider>
       <Canvas
         camera={{ position: [85, 60, 85], fov: 42 }}
         shadows={{ type: THREE.PCFShadowMap }}
+        gl={{
+          powerPreference: "high-performance",
+          antialias: true,
+          stencil: false,
+        }}
+        onCreated={handleCanvasCreated}
       >
         <Suspense fallback={null}>
           <World onLoadingStateChange={handleSceneLoadingStateChange} />