globe-particles

Build a BufferGeometry with two particle populations: points distributed on a sphere for the core and points along a tilted ring. Render them as THREE.Points with a custom ShaderMaterial using circular point sprites and additive blending.

Use gl_PointCoord in the fragment shader to compute distance from the point center, then apply a smoothstep falloff so alpha fades to zero at the edge. Squaring the alpha and using additive blending produces a crisp luminous dot.

Yes. Check window.matchMedia("(prefers-reduced-motion: reduce)") and skip the requestAnimationFrame loop, rendering a single static frame instead. This globe recipe renders a still object when reduced motion is requested.

Excessive point size, bloom, or fog destroys the globe silhouette. Lower u_pointSize, reduce particle counts, and rely on density and depth falloff rather than heavy glow so the sphere and ring stay distinct.

Cancel the animation frame, remove window event listeners, and call dispose() on the geometry, material, and renderer. The init function returns a cleanup callback that performs all of these steps.