jnsmalm / pixi3d

The 3D renderer for PixiJS. Seamless integration with 2D applications.
https://pixi3d.org
MIT License
752 stars 43 forks source link

Optimization #116

Closed antag0n1st closed 2 years ago

antag0n1st commented 2 years ago

Hi I want to understand how to optimize this scene , so that objects that are not visible are not shown. Or maybe batch render all the cubes at ones.

Here is a working example I made that I want to optimize so that I can display more cubes https://codesandbox.io/s/long-currying-ortbc1

thank you.

jnsmalm commented 2 years ago

Hello!

You can use instancing to reduce draw calls. In your example, create first a mesh outside the loop then create instance inside the loop.

// Outside loop
let parent = app.stage.addChild(Mesh3D.createCube());

// Inside loop
let mesh2 = app.stage.addChild(parent.createInstance());