This is a simulated picture of microscope written by Three.js.
When I did this web page I met a low performance problem of rendering over 20000 or more objects.
The root is that I want to draw many square to represent pixels with different color. Every cell had about 20-30 pixels and a line that presents their border. A canvas had about 500 cells. so the total amount of objects to be rendered is over 10000 in a window. It take over 20 second to render all the things on my laptop.At the final I solved the problem by using projection to project all the cell body to one picture, and using this picture as a transparent texture of the window. so that I only have to render 500 objects. But this way doesn’t solve the root performance problem.
Now I prepare to draw some 3D neuron tissue structure like:
I think I must create a huge number of objects so that I’m very worried about the performance problem.
Can WebGPURender do this ? Or if you also have any advice please tell me. ^^