Hi everyone!
I was using gltfjsx
to convert all my models glb/gltf
files into jsx/tsx
components then using it. But the problem is gltfjsx
is giving me more than 3k- 4k lines of code for a single component. So I tried using useGLTF
from drei
directly. like this
import { useGLTF } from "@react-three/drei";
const Dummy = () => {
const { scene } = useGLTF("/dummy.glb");
return <primitive object={scene} />;
};
export { Dummy };
and then rendered it like this:
{DummyArray.map((currentPos, index) => {
return (
<RigidBody lockRotations key={index}>
<Dummy position={currentPos} />
</RigidBody>
);
})}
previously with gltfjsx
I was seeing as many copies of Dummy component
as there were elements (positions) in the array but now when I’m using useGLTF
I only see one copy.