How to animate thousands of spheres with the best performance?

Instancing is one (good) option. Another is adapting THREE.Points to look more like spheres. I have an example at Bouncing points, spatial hashing (Edit: Note that rendering is far from a bottleneck in that case, so instancing could have done the same job). It makes the points round and have a color gradient from the center and out. With a texture they can be made to look a bit like lit spheres (see the three.js example three.js examples ). I also imagine it is possible to make a custom shader that will render gl_points as perfect spheres with correct projection, lighting and depth, but it may turn out to be prohibitively computationally expensive. I have long wanted to try, though. One day… Update: Coding jam: Pixel-perfect spheres without high-res geometry :partying_face: (Depth is sketchy, though, because of technical limitations.)

Our suggestions so far have regarded increasing the rendering performance. I get the impression that your question is just as much about how to make a video from a number of frames made with equal timesteps. Is that right? Or, maybe not a video, but a stored (precomputed) sequence of states that you want to move spheres according to. (One representation of such a precomputed sequence could actually be a vertex videotexture.)

3 Likes