Tengo un problema con el parpadeo al renderizar una nube de puntos en movimiento en Three.js. El problema solo aparece cuando la página se carga en una pantalla Macbook Pro Retina. Curiosamente, si la página se carga en un monitor externo (2560x1440) y se arrastra a la pantalla retina, no hay problema de parpadeo. Si vuelvo a cargar la misma página en la pantalla retina, el parpadeo comienza de nuevo. No hay problemas de parpadeo en un iPhone.

El fondo no parpadea y solo ocurre cuando la nube de puntos se mueve. No importa si el movimiento es una velocidad constante. Toda la nube de puntos parpadea al mismo tiempo.

renderizador:

 renderer = new THREE.WebGLRenderer({ powerPreference: "high-performance" });

Material:

 const material = new THREE.PointsMaterial({ vertexColors: true, size: 1, sizeAttenuation: false, depthTest: false, transparent: true, opacity: 0.4, alphaTest: 0.2 });

Lo siguiente no cambia el problema:

• Cambiar el frustum cercano o lejano
• Habilitación del suavizado
• No relacionado con z-fighting. Las pruebas de profundidad o la escritura no marcan la diferencia.
• Opacidad, alphaTest, transparente
• Reducir el número de puntos en la nube de puntos
• Cambio de navegadores (probado en Chrome, Safari, Firefox)
• Cambiar la preferencia de potencia del renderizador

Parece que no puedo entender por qué los problemas son específicos de la pantalla Macbook Pro Retina.

Gracias por la ayuda.