Equivalent of Three.js's `InstancedMesh`

[andretchen0]

Description

As a developer using TresJS, I would like an equivalent of Three.js's instancedMesh to improve performance.

Suggested solution

Drei's <Instances />

Alternative

No response

Additional context

No response

Validations

• [X] I agree to follow this project's Code of Conduct
• [X] Read the Contributing Guidelines.
• [X] Read the docs.
• [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.

[Sea-DH1]

Hi, you can use TresInstancedMesh <TresInstancedMesh ref="instancedMesh" :args="[geometry, material, maxGeometryCount]" @click="instanceMeshClick" />

[andretchen0]

@Sea-DH1

Hi, you can use TresInstancedMesh

Sure thing. The idea is to bring it to Tres/Cientos so it's possible to do something like:

<InstancedMesh :count="1000">
  <Box>
    <TresMeshNormalMaterial />
  </Box>
</InstancedMesh>

[Sea-DH1]

@andretchen0 Well, I understand what you mean. I feel like I can help implement this component.

[andretchen0]

@Sea-DH1

Sure thing. If you're new to Tres, this particular issue might be a bit of a challenge, but you're more than welcome to give it a shot!

[andretchen0]

Hey @Sea-DH1 , are you interested in trying to make a component for InstancedMesh? If so, I'll assign you.

[alvarosabu]

Hey @andretchen0 @Sea-DH1 we got a interesting feedback from @Dekier on Discord about creating an abstraction with Frustum Culling support https://stackblitz.com/edit/instancedmesh2-forest?embed=1&file=src%2Fmain.ts

Is this already on the scope of this ticket?

[andretchen0]

@alvarosabu

Thanks! Looks interesting! That might be a nice way to approach things.