Disposing of a mesh question

[josooosjf]

Im trying to figure out the best way to dispose of an object (ie a game where if two objects were to touch one would be removed from the scene). I cant figure out how to target the react-three-fiber scene...

if i have a function like this:

js const deleteThing = function() { Scene.remove(mesh); mesh.current.geometry.dispose(); mesh.current.material.dispose(); mesh.current = undefined; }

Scene.remove doesn't target the react-three-fiber scene. Maybe this is easy but just new to react-3-fiber.

could anyone help me with what im supposed to target?

[gsimone]

You should let r3f handle object disposition, you can just unmount the react component and everything will be disposed.

Here's a super simple example https://codesandbox.io/s/r3f-basic-demo-nbyw2?file=/src/index.js

[geoff-harper]

@drcmda quick follow-up question, since I'm having a bit of trouble with the api doc. Would <mesh geometry={globalGeometry} material={globalMaterial} /> dispose of globalGeometry and globalMaterial when unmounted or just the mesh instance itself?

[shazib-summar]

@gsimone the codesandbox is no longer there. could you update it please... Im new to r3f and webdev and this is very confusing for me

[shazib-summar]

You should let r3f handle object disposition, you can just unmount the react component and everything will be disposed.

Here's a super simple example https://codesandbox.io/s/r3f-basic-demo-nbyw2?file=/src/index.js

how do i unmount a r3f element

[drcmda]

@drcmda quick follow-up question, since I'm having a bit of trouble with the api doc. Would dispose of globalGeometry and globalMaterial when unmounted or just the mesh instance itself?

yes, it would dispose. always use <mesh dispose={null} /> if you're dealing with global data. primitive will not dispose on its own.

[ssulehri]

Hi guys, this thread seems very helpful. however, both of your links have expired. Any chance you guys can re-share them or post a permalink?

I am referring to the following links:
https://codesandbox.io/s/r3f-basic-demo-nbyw2?file=/src/index.js
https://github.com/react-spring/react-three-fiber/blob/master/api.md#automatic-disposal