js实现自定义银河系

HTML:

<link href='//fonts.googleapis.com/css?family=Raleway:100' rel='stylesheet' type='text/css'>
<link href='//fonts.googleapis.com/css?family=Berkshire+Swash' rel='stylesheet' type='text/css'>
<div class="intro">
  	<p style="background:#000">		
				<a href="http://www.big-culture.com/" target="_blank" style="color:#fff"></a></p>
</div>

JavaScript:

var w = window.innerWidth;
var h = window.innerHeight;

var dustCanvas = document.createElement('canvas');
var dustCtx = dustCanvas.getContext('2d');
var starCanvas = document.createElement('canvas');
var starCtx = starCanvas.getContext('2d');

document.body.appendChild(dustCanvas);
document.body.appendChild(starCanvas);

dustCanvas.width = starCanvas.width = w;
dustCanvas.height = starCanvas.height = h;

dustCtx.globalCompositeOperation = 'lighter';
starCtx.globalCompositeOperation = 'lighter';

var galaxies = [];

var mouse = {
   
  pos: {
   
    x: w * 0.5,
    y: h * 0.5
  },
  speed: 0
};

var randomNumbers = length => Array.from(new Array(length), () => Math.random());
var PI = Math.PI;
var TAU = PI * 2;
var r = () => Math.random();
var angle2 = (p1,p2) => Math.atan2(
  p2[1]-p1[1],
  p2[0]-p1[0]
);
var distance2 = (p1,p2) => Math.sqrt(
  Math.pow(p1[0]-p2[0], 2) + 
  Math.pow(p1[1]-p2[1], 2)
);

var createDustParticle = (color) => {
   
  
  var canvas = document.createElement('canvas');
  
  var w = 100;
  var h = 100;
  var cx = w * 0.5;
  var cy = h * 0.5;
  
  canvas.width = w;
  canvas.height = h;
  var ctx = canvas.getContext('2d');
  canvas.ctx = ctx;
  
  var xRand = -5 + (r()*10);
  var yRand = -5 + (r()*10);
  var xRand2 = 10 + (r()*(cx/2));
  var yRand2 = 10 +