diff --git a/webclient/src/components/ObjectViewInternal.tsx b/webclient/src/components/ObjectViewInternal.tsx index 9e57047..901f83f 100644 --- a/webclient/src/components/ObjectViewInternal.tsx +++ b/webclient/src/components/ObjectViewInternal.tsx @@ -1,7 +1,7 @@ import type { ObjectType, RuntimeGameObjectInstance, RuntimeObjectInstance } from "../types"; -import { useEffect, useImperativeHandle, useRef, type Ref } from "react"; -import { Euler, Quaternion, type Group } from "three"; -import { Instance, Instances } from "@react-three/drei"; +import type { VoxelGroup } from "../types/runtime/voxelGroup"; +import { useEffect, useImperativeHandle, useLayoutEffect, useRef, type Ref, memo } from "react"; +import { Euler, Matrix4, Quaternion, type Group, type InstancedMesh } from "three"; import type { ThreeEvent } from "@react-three/fiber"; import { ConvexHullCollider, RapierRigidBody } from "@react-three/rapier"; import { SyncRigidBody } from "./SyncRigidBody"; @@ -9,6 +9,30 @@ import { reaction, runInAction } from "mobx"; import { v3toRapier } from "../utils"; import { state } from "../state"; +const _m4 = new Matrix4(); + +const VoxelGroupMesh = memo(function VoxelGroupMesh({ vg }: { vg: VoxelGroup }) { + const ref = useRef(null); + + useLayoutEffect(() => { + const mesh = ref.current; + if (!mesh) + return; + vg.positions.forEach(([x, y, z], i) => { + mesh.setMatrixAt(i, _m4.makeTranslation(x, y, z)); + }); + mesh.instanceMatrix.needsUpdate = true; + mesh.computeBoundingSphere(); + }, [vg]); + + return ( + + + + + ); +}); + export type ObjectViewInternalHandle = { group: Group | null; rb: RapierRigidBody | null; @@ -118,11 +142,7 @@ export const ObjectViewInternal = function ({ object, objectType, ref, ...props > { object.cache.voxelGroups.map((vg) => - - - - {vg.positions.map((pos, i) => )} - + ) } {object.cache.colliderMesh && }