Performance with many tube elements

Questions
1

Hello, I started using Babylon.js for a new project and am impressed how easy it is to get started!
My goal is to create a gcode viewer (files used for 3d printing instructions). The gcode basically contains the path the printer takes and the problem is that these can get really big.
So I created a benchmark file with ~200 000 lines and tested several ways of creating meshes:

  • New Tubes for every continuous line. This resulted in 25000 Meshes and less than 5 fps
  • Then I tried using a linesystem, which was very fast with 500fps shown in the debug menu, although it is not really usable, because there is no shading on the lines.
  • I tried creating 200000 instances of a cylinder, to simulate using manually arranged instances, but this also had less than 5 fps
  • Then I tried merging the tube meshes using BABYLON.Mesh.MergeMeshes. This took more than 30 minutes, but resulted in extremly high framerates (~300fps). The loading time is unfortunately prohibitive.
  • Then I created one Tube per layer (there were 200 layers), which resulted in good fps, but all the lines that should not be connected were connected to use just one tube.

So the problem is that merging the meshes takes extremely long, but I don’t want all lines to be connected, so I can’t use the tube command for more than one continous line. What I need would be a way to create tubes with missing segments, or maybe hide the extra segments by some other method. I didn’t find anything like this though.
Maybe I’ll try creating a custom version of CreateTube, which allows missing pieces, but as of now I didn’t really understand the inner workings of this method.

I also tried everything in the optimization guide, but everything except merging had no measurable impact.

2

Maybe you could try serializing the scene after merge meshes and reuse this later on ?

1 Like
3

The tube has by default numerous vertices. Did you try with a lighter model like a ribbon or a custom extruded mesh from a simple shape (triangle ?) ?

2 Likes
4

Thanks for your suggestions!
@sebavan This unfortunately isn’t possible, because the gcode on which the model is based is uploaded by the user.
@jerome I used tesselation: 3 to make the tube essentially an extruded triangle, but I tried extruding a triangle using the ExtrudeShape function and got 1013026 instead of 1350691 vertices. So it’s a small but good improvement!

I found that by instead of merging all the meshes only merging each layer I get the merging time down to 10 seconds while keeping the same fps (with 300 meshes)! This is ok, although I’m experimenting with creating a custom mesh atm to completly skip the merging step.

2 Likes
5

What does a sample of your dataset look like?

Could this be done with volumetric rendering?

6

200K (frozen) instances of a cylinder or 200K cylinders as solid particles may work imho

7

200K three-tessellated cylinders : https://playground.babylonjs.com/#SE22AV#18

3 Likes
8

I’m getting 60fps on my phone.

2 Likes
10

Many models are composed of multiple meshes. Can we create SPS and ensure their relative positions are correct? And its animation? Can each particle carry an animation? The other is to change the color and transparency of the model;Babylon has no concept of object (many sub grids are combined into one object) which is very complex for the operation model;

11

you could use particle parenting to set animations of articulated parts : https://playground.babylonjs.com/#SE22AV#23
I agree this can be quite complex to implement and compute then.

12

https://playground.babylonjs.com/#SE22AV#24 spaghetti !

2 Likes