perf(map): snap assets to terrain

src/components/three/world/EcoleModel.tsx

@@ -0,0 +1,20 @@
+import { useGLTF } from "@react-three/drei";
+import { MergedStaticMapModel } from "@/components/three/world/MergedStaticMapModel";
+import type { Vector3Tuple } from "@/types/three/three";
+
+const ECOLE_MODEL_PATH = "/models/ecole/model.gltf";
+
+interface EcoleModelProps {
+  position: Vector3Tuple;
+  rotation: Vector3Tuple;
+  scale: Vector3Tuple;
+  castShadow?: boolean;
+  receiveShadow?: boolean;
+  onLoaded?: () => void;
+}
+
+export function EcoleModel(props: EcoleModelProps): React.JSX.Element {
+  return <MergedStaticMapModel modelPath={ECOLE_MODEL_PATH} {...props} />;
+}
+
+useGLTF.preload(ECOLE_MODEL_PATH);

src/components/three/world/FermeVerticaleModel.tsx

@@ -0,0 +1,24 @@
+import { useGLTF } from "@react-three/drei";
+import { MergedStaticMapModel } from "@/components/three/world/MergedStaticMapModel";
+import type { Vector3Tuple } from "@/types/three/three";
+
+const FERME_VERTICALE_MODEL_PATH = "/models/fermeverticale/model.gltf";
+
+interface FermeVerticaleModelProps {
+  position: Vector3Tuple;
+  rotation: Vector3Tuple;
+  scale: Vector3Tuple;
+  castShadow?: boolean;
+  receiveShadow?: boolean;
+  onLoaded?: () => void;
+}
+
+export function FermeVerticaleModel(
+  props: FermeVerticaleModelProps,
+): React.JSX.Element {
+  return (
+    <MergedStaticMapModel modelPath={FERME_VERTICALE_MODEL_PATH} {...props} />
+  );
+}
+
+useGLTF.preload(FERME_VERTICALE_MODEL_PATH);

src/components/three/world/GenerateurModel.tsx

@@ -0,0 +1,22 @@
+import { useGLTF } from "@react-three/drei";
+import { MergedStaticMapModel } from "@/components/three/world/MergedStaticMapModel";
+import type { Vector3Tuple } from "@/types/three/three";
+
+const GENERATEUR_MODEL_PATH = "/models/generateur/model.gltf";
+
+interface GenerateurModelProps {
+  position: Vector3Tuple;
+  rotation: Vector3Tuple;
+  scale: Vector3Tuple;
+  castShadow?: boolean;
+  receiveShadow?: boolean;
+  onLoaded?: () => void;
+}
+
+export function GenerateurModel(
+  props: GenerateurModelProps,
+): React.JSX.Element {
+  return <MergedStaticMapModel modelPath={GENERATEUR_MODEL_PATH} {...props} />;
+}
+
+useGLTF.preload(GENERATEUR_MODEL_PATH);

src/components/three/world/LafabrikModel.tsx

@@ -0,0 +1,20 @@
+import { useGLTF } from "@react-three/drei";
+import { MergedStaticMapModel } from "@/components/three/world/MergedStaticMapModel";
+import type { Vector3Tuple } from "@/types/three/three";
+
+const LAFABRIK_MODEL_PATH = "/models/lafabrik/model.gltf";
+
+interface LafabrikModelProps {
+  position: Vector3Tuple;
+  rotation: Vector3Tuple;
+  scale: Vector3Tuple;
+  castShadow?: boolean;
+  receiveShadow?: boolean;
+  onLoaded?: () => void;
+}
+
+export function LafabrikModel(props: LafabrikModelProps): React.JSX.Element {
+  return <MergedStaticMapModel modelPath={LAFABRIK_MODEL_PATH} {...props} />;
+}
+
+useGLTF.preload(LAFABRIK_MODEL_PATH);

src/components/three/world/MergedStaticMapModel.tsx

@@ -1,12 +1,13 @@
 import { useEffect, useRef } from "react";
-import * as THREE from "three";
 import { useGLTF } from "@react-three/drei";
+import { useThree } from "@react-three/fiber";
+import * as THREE from "three";
 import { mergeGeometries } from "three/addons/utils/BufferGeometryUtils.js";
 import type { Vector3Tuple } from "@/types/three/three";
+import { optimizeGLTFSceneTextures } from "@/utils/three/optimizeGLTFScene";
 
-const ECOLE_MODEL_PATH = "/models/ecole/model.gltf";
-
-interface EcoleModelProps {
+interface MergedStaticMapModelProps {
+  modelPath: string;
   position: Vector3Tuple;
   rotation: Vector3Tuple;
   scale: Vector3Tuple;
@@ -117,21 +118,26 @@ function createMergedMeshes(scene: THREE.Group): MergedMeshData[] {
     .filter((meshData): meshData is MergedMeshData => meshData !== null);
 }
 
-export function EcoleModel({
+export function MergedStaticMapModel({
+  modelPath,
   position,
   rotation,
   scale,
   castShadow = true,
   receiveShadow = true,
   onLoaded,
-}: EcoleModelProps): React.JSX.Element {
-  const { scene } = useGLTF(ECOLE_MODEL_PATH);
+}: MergedStaticMapModelProps): React.JSX.Element {
+  const { scene } = useGLTF(modelPath);
+  const maxAnisotropy = useThree((state) =>
+    state.gl.capabilities.getMaxAnisotropy(),
+  );
   const groupRef = useRef<THREE.Group>(null);
 
   useEffect(() => {
     const group = groupRef.current;
     if (!group) return;
 
+    optimizeGLTFSceneTextures(scene, maxAnisotropy);
     const mergedMeshes = createMergedMeshes(scene);
     const meshes = mergedMeshes.map((meshData) => {
       const mesh = new THREE.Mesh(meshData.geometry, meshData.material);
@@ -153,7 +159,7 @@ export function EcoleModel({
         disposeMaterial(mesh.material);
       }
     };
-  }, [castShadow, onLoaded, receiveShadow, scene]);
+  }, [castShadow, maxAnisotropy, modelPath, onLoaded, receiveShadow, scene]);
 
   return (
     <group
@@ -164,5 +170,3 @@ export function EcoleModel({
     />
   );
 }
-
-useGLTF.preload(ECOLE_MODEL_PATH);

src/components/three/world/TerrainModel.tsx

@@ -1,7 +1,9 @@
 import { useEffect, useMemo, useRef } from "react";
 import * as THREE from "three";
 import { useGLTF } from "@react-three/drei";
+import { useThree } from "@react-three/fiber";
 import type { Vector3Tuple } from "@/types/three/three";
+import { optimizeGLTFSceneTextures } from "@/utils/three/optimizeGLTFScene";
 
 const TERRAIN_MODEL_PATH = "/models/terrain/model.gltf";
 const TERRAIN_DEFAULT_POSITION: Vector3Tuple = [0, 0, 0];
@@ -39,12 +41,16 @@ export function TerrainModel({
   const internalRef = useRef<THREE.Group>(null);
   const ref = groupRef ?? internalRef;
   const { scene } = useGLTF(TERRAIN_MODEL_PATH);
+  const maxAnisotropy = useThree((state) =>
+    state.gl.capabilities.getMaxAnisotropy(),
+  );
 
   const terrainModel = useMemo(() => {
+    optimizeGLTFSceneTextures(scene, maxAnisotropy);
     const model = scene.clone(true);
     applyTerrainMaterialSettings(model, receiveShadow);
     return model;
-  }, [scene, receiveShadow]);
+  }, [maxAnisotropy, scene, receiveShadow]);
 
   useEffect(() => {
     onLoaded?.();