Mysterious Disappearing Particle System / Moire Pattern

Hello All,

I’m working to implement a simple particle system in react-three-fiber (which may or may not be relevant to these issues) based on the example from this post.

Minimal example: particle-system-minimal-r3f - CodeSandbox

I have a couple questions about this which I hope you could help me with:

  1. The particle system appears and disappears seemingly at random. Sometimes some of the particles will disappear. Sometimes all of the particles will disappear. The system implements a depth sort, which according to one of the answers in this post is potentially related.

  1. The particles show a interference (Moiré) pattern on a Windows computer (but not on a Mac). This pattern is visible in the middle screenshot above. I assume the fact that it doesn’t show up on my Mac may have to do with the higher pixel-density, but am open to suggestions on how to solve it!

Any thoughts / guidance is much appreciated. It is worth noting that I’m not seeing these issues in the vanilla three.js version, so perhaps I’m doing something incorrect in react / react-three-fiber land.