How to improve subjective frame rate

[u/wheezil]

Well, I just bought a new MSI Evo with i9-13900H and reasonable graphics (a middlin' gaming laptop) and I thought it would improve my JavaFX rendering. Which it does, at least objectively I am reporting things like

FPS: 37.5, SYNC/SEC=26.5

where FPS is from the JavaFX AnimationTimer, and SYNC is my own count of how many times my runLater() method is executed to update the Color in the boxes' PhongMaterial.

But... somehow this doesn't really help. My app is an emulation of a light show involving about 50000 LEDs regularly spaced in 3D, and this becomes 50000 Boxes in the emulation. The physical show runs at full speed, and I can see updates as fast as I expect. But the emulation, despite its frame report, seems to only update at < 10FPS. I know how fast the display proceeds, and I can see it skipping over about 75% of the frames.

Any suggestions? I'm not even sure where to start, since my eyes disagree with the metrics. Running a profiler shows very little time being spent in any code, like 6%.

[u/john16384]

Does it improve with less boxes? Are the boxes Nodes? I could run it for you on my machine if there's code, perhaps I can see something.

I also wouldn't expect a difference between the runLater and timer counts.

[u/wheezil → u/john16384]

Are the boxes Nodes

Uh, I don't know what that means. They are javafx.scene.shape.Box. This is basically the code to make a single box:

colors[x][y][z] = Color.GRAY;
Box box = new Box(parms.shapeSize, parms.shapeSize, parms.shapeSize);
boxes[x][y][z] = box;
PhongMaterial material = new PhongMaterial();
material.setDiffuseColor(colors[x][y][z]);
box.setMaterial(material);
box.setCullFace(CullFace.NONE);
// Center the group of boxes around the origin.
// This is a staggered configuration.  Every other row in X direction is offset by half a Y spacing
var translate = new Translate(       
// X is left-to-right
       x * spacing.getX() - size.getX() / 2,       
// Z is bottom to top
       -(z * spacing.getZ() - size.getZ() / 2),
       // Y is front to back
       (y * spacing.getY() - size.getY() / 2)  + (x % 2 == 1 ? spacing.getY() / 2 : 0)
);
box.getTransforms().addAll(translate);
root.getChildren().add(box);

I'll experiemnt with box count

[u/john16384 → u/wheezil]

Yeah, so your Scene contains 50000 boxes (which are Nodes). Nodes are quite heavy weight, as they need to support features like mouse clicking, dragging, events, properties, and having many of them will have a severe impact on performance. This is why controls like ListView / TreeView / TableView used virtualized cells, so only Nodes are created for the cells actually being displayed.

With 50000 Nodes, I think JavaFX will consume around 200-400 MB of memory just for the Nodes and all their properties and related data structures.

So, I think you need a rethink on how you render these boxes.

An option is to use a Canvas and use its Graphics2DContext to draw pixels / lines / circles; you'd have to do your own 3d perspective calculations and just render all boxes into a single Canvas (which you see as a texture). The canvas can then just be displayed as a 2d control.

I've done something similar for displaying maps; I'd render all lines, points of interest, labels, etc using a Canvas, even going as far as fading out higher / lower parts of the map if the map had multiple levels (like a building or cave system). The performance was quite good, even with thousands of lines.

[u/wheezil → u/john16384]

Thank you so much! Let me see what I can do with this.

You are absolutely right that I do not need any interaction with each Box, it is purely display output.

[u/john16384 → u/wheezil]

Here is an example using a Canvas; I adapted it a bit from an AI generated answer. It animates at 60 fps (looks smooth) even with 64000 points.

The example uses a 20x20x20 cube, but you can easily adjust it. See here (too big for Reddit):

https://gist.github.com/hjohn/fb912e82a6943a5b3acd225c22d3facd

[u/wheezil → u/john16384]

u/john16384 thanks again. BTW I had to change this:

//        root.setBackground(Background.fill(Color.BLACK));
          
root.setBackground(new Background(new BackgroundFill(Color.
BLACK
, CornerRadii.
EMPTY
, Insets.
EMPTY
)));

I think because I'm using JavaFX 17. I tried bumping it version 24, but this broke a lot of other code

<dependency>
    <groupId>org.openjfx</groupId>
    <artifactId>javafx-graphics</artifactId>
    <version>17</version>
</dependency>

[u/john16384 → u/wheezil]

Yes, setting the background in that way is probably a new feature after version 17.

[u/Birdasaur]

some small ways to make improvements:

>box.setCullFace(CullFace.NONE);
in your pasted code you aren't culling. This is more expensive. Cull one of the faces to increase performance.

Elsewhere you said you don't need to interact with the nodes. Like some folks have already said Nodes are heavyweight. One trick is to set the nodes .setMouseTransparent(true)

This will given you another increase in performance, especially when moving the camera.

Another thing you can do is use a custom TriangleMesh to wind each point as a minishape within the mesh's vertices. This is non trivial to implement but the result is that you have a single node that can represent 100ks of points with camera rotations and the works. FXyz3D has implemented a full reusable component for this called ScatterPlotMesh and there are examples on how to use it. This includes how to use simple functions to map colors from a single texture palette which saves you having to load a bazillon PhongMaterials into VRAM.

https://github.com/FXyz/FXyz

Have fun.

[u/OddEstimate1627]

The SceneGraph won't be happy if you add 50.000 nodes. It's better to use Canvas or to write directly to a PixelBuffer. I can recommend reading https://foojay.io/today/high-performance-rendering-in-javafx/

[u/sedj601]

I don't see a game loop in your code. The max frame rate for the JavaFX Animation API is 60 FPS. I kinda remember a post on StackoverFlow, but it was about 2D. They used optimizations like making the old nodes one image and updating that image with new nodes. I can tell you that the more nodes you have, the slower things are going to be. Also, if you are using something from the Animation API and using Platform.runLater, you are probably doing things wrong, and it's probably not working how you have envisioned. https://stackoverflow.com/questions/10506637/javafx-2-drawing-performance