I have separated the data into groups of 5 celestial bodies (all three D objects, not sprites/particles) comprising of one central star (shown in pink); and 4 orbiting planets (shown in green).
The planets are shown in their starting position equally spaced around the star. The aim is to animate the orbit of the planets around the central star. Also, the planets will be rendered with a high def skin. The code below shows only 100 data points (20 stars, 80 planets) rather than ~2000 data points for the actual project code.
Considering the above, is it possible to animate so many 3d objects in a scene? Or is it better to use another object type such as particle or sprites?
Previously I had rendered a skin around 2Mb png to each planet and the browser crashed and did not allow the camera to pan etc. Is there a particular file format/method of mapping an image to an object where the performance of the browser is not affected and the quality of the image is sharp?
See full code in codesandbox (if scene not rendered initially, delete one of the commented out lines and the scene will appear): THREE.js (forked) - CodeSandbox
Thanks in advance.