0

In my application I create a 3d maze using a gridHelper and positioning cubes on top of the grid. I use each maze for a specific amount of time and after that I overwrite it by another one. My problem is from what I understand is that I don't dispose the previous meshes but I really don't know how. Bellow I display the code. I use React and three-fiber.

function PositionCube(x,y,len) {
    let x_start = -(len - 1)/2;
    let y_start = -(len - 1)/2;
    x += x_start
    y += y_start
    return(
        
        <mesh position={[y, 0, x]} rotation={[0, 0, 0]} >
        <boxBufferGeometry 
            attach="geometry" 
            args={[1, 0.5, 1]} 
        />
        <meshStandardMaterial
            attach="material"
            color="blue"
            transparent
            roughness={1}
            metalness={5}
            opacity={0.8}
        />
        </mesh>
    )
}

This is how I position the cube on the grid

export default function NewGrid(props) {
    let rets = [];
    let len = props.maze.length;
    props.maze.map((row, i) => {
        row.map((col, j) => {
            if (col === 1) {
                rets.push(PositionCube(i, j, props.maze.length))
            }
        })
    })
    console.log(rets);
    
    return (
        <Canvas
            camera={{
            position: [0, 8, 0]
            }} frameloop="demand">
            <group dispose={null}>
            <gridHelper args={[props.maze.length, props.maze.length, `white`, `gray`]} />
            <ambientLight intensity={2}/>
            <Suspense fallback={null}>
            {rets}
            </Suspense>
            <EffectComposer multisampling={2}>
        </EffectComposer>
        </group>
        </Canvas>
        )
}

This is how I display the cubes. In the props.maze I have a 2d list filled with 0s and 1s and when I find a 1 I display a cube on that position. What I want to do is before each new render (meaning a new maze) I want somehow to delete the previous one and free up the memory. Any ideas? Thanks <3

niko pi
  • 1
  • Meshes are to be reused always when possible! – juagicre Apr 23 '22 at 18:32
  • do you think a solution would be to render every possible cube and then conditional render the ones i need? – niko pi Apr 23 '22 at 19:40
  • If it's about having the same mesh: re-use the same mesh for each 3d object. Another solution would be to merge all meshes and create a single 3d object (look for the merge documentation, it will for sure boost your scene) – juagicre Apr 23 '22 at 22:15

0 Answers0