JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/84/three.min.js"></script>
<div>
  <span>PNG:</span><span id="png">
</span>
  <span>JPG:</span><span id="jpg">
</span>
</div>
<div id="threejs">

</div>

CSS

html,
body {
  color: #fff;
  background-color: #000;
}

span,
span img {
  vertical-align: middle;
}

#threejs {}

JavaScript

var usePNG = true;

	var ParticleVertexShader = [
	  "attribute vec3 origin;",
	  "attribute vec3 center;",
	  "attribute float angle1;",
	  "attribute float angle2;",
	  "attribute float speed1;",
	  "attribute float speed2;",
	  "attribute vec3 color;",

	  "uniform float size;",
	  "uniform float scale;",
	  "uniform float time;",

	  "varying vec3 vColor;",

	  "void main() {",
	  "vColor = color;",
	  "float a = angle1+(speed1*time);",
	  "float rx = (cos(a) * (origin.x - center.x)) - ((sin(a) * (origin.y - center.y)) + center.x);",
	  "float ry = (sin(a) * (origin.x - center.x)) + ((cos(a) * (origin.y - center.y)) + center.y);",

	  "float a2 = angle2-(speed2*time);",
	  "float rx1 = cos(a2) * rx;",
	  "float rz1 = sin(a2) * rx;",

	  "vec3 pos = vec3(rx1, ry, rz1);",

	  "vec4 mvPosition = modelViewMatrix * vec4(pos, 1.0);",

	  "gl_PointSize = size * (scale / length(mvPosition.xyz));",

	  "gl_Position = projectionMatrix * mvPosition;",
	  "}"
	].join("\n");

	var ParticleFragmentShader = [
	  "uniform sampler2D map;",
	  "uniform sampler2D jmap;",

	  "varying vec3 vColor;",

	  "void main() {",
	  "vec4 aColor = texture2D(map, gl_PointCoord);",
	  "if (aColor.a < ALPHATEST) discard;",

	  "vec3 outgoingLight = vec3(0.0);",

	  "vec4 diffuseColor = texture2D(jmap, gl_PointCoord);",
	  "diffuseColor.rgb *= vColor;",

	  "vec3 shadowMask = vec3(1.0);",

	  "outgoingLight = diffuseColor.rgb;",

	  "gl_FragColor = vec4(outgoingLight, aColor.a);",
	  "}"
	].join("\n");

	// Torus
	var trad = 1.3; // distance of center of tube to center of torus (1.3)
	var tube = 0.4; // (0.6)

	// Points
	var r1 = trad; // distance of center of tube to center of torus
	var r2 = tube; // radius of tube
	var numParticles = 70000;
	var numDrawParticles = numParticles;
	var numMinDrawParticles = 20000;
	var particles = null;
	var particleMap = null;
	var particleMapJpg = null;
	var particleScale = 0;
	var particleShaderMaterial = null;

	var scenepos = new THREE.Vector3(0, -0.25,...