Test showing the use of a scene graph / canvas abstraction layer instead managing the canvas context directly.

scene-graph.js

      function init() {

            "use strict" ;

            var canvas = document.getElementsByTagName("canvas")[0] ;
            var context = canvas.getContext("2d") ;
            var particles = [] ;
            var width = 1024 ;
            var height = 680 ;
            var color = "#283137" ;
            var lineColor = "#647E8D" ; 
            var background = "#0E0F15" ;
            var mouse = {x: 0, y: 0};
            var maxSize = 5 ;
            var count = 50 ;
            var radius = 500 ;
            var speed = 0.01 ;

            canvas.width = width ;
            canvas.height = height ;
            canvas.style.background = "#0E0F15" ;

            // create the particles

            for ( var x = 0 ; x < count ; x++ ) {

				generateParticle() ;

            }     

            // generate a particle

            function generateParticle() {

			var randomX = Math.random() * width;
			var randomY = Math.random() * height;
			var randomR = Math.random() * maxSize;

			particles.push({'x':randomX,'y':randomY,'r':randomR}) ;

		}

            // playhead

            setInterval(function() {

            	for ( var x = 0 ; x < particles.length ; x++ ) {

					var coodX = particles[x].x;
					var coodY = particles[x].y; 

					var randomX = Math.random() ;
					var randomY = Math.random() ;

					particles[x].x = coodX - randomX * ((mouse.x-width/2)*speed) ;
					particles[x].y = coodY - randomY * ((mouse.y-height/2)*speed) ;

					if ( particles[x].x > width || particles[x].x < 0 || particles[x].y > height || particles[x].y < 0 ) {

						generateParticle() ;
						particles.splice(x, 1);

					}

            	}

            	render() ;

            }, 1) ;    

            // scene render

            function render() {

            	context.clearRect(0, 0, canvas.width, canvas.height) ;

                  var randomParticle = Math.floor( Math.random() * 100 ) ;

                  //drawLine(particles[randomParticle+1].x,particles[randomParticle+1].y,particles[randomParticle].x,particles[randomParticle].y) ;
                  //drawLine(particles[randomParticle-1].x,particles[randomParticle-1].y,particles[randomParticle].x,particles[randomParticle].y) ;

            	for ( var x = 0 ; x < particles.length ; x++ ) {
				context.fillStyle = color ;
				context.beginPath();
				context.arc(particles[x].x,particles[x].y,particles[x].r,0,2*Math.PI);
				context.fill();

                         drawLine(particles[x+1].x,particles[x+1].y,particles[x].x,particles[x].y) ;

				if ( ( mouse.x - particles[x].x < radius && mouse.x - particles[x].x > radius*-1 ) && ( mouse.y - particles[x].y < radius && mouse.y - particles[x].y > radius*-1 ) ) {

                              drawLine(particles[x].x,particles[x].y,mouse.x,mouse.y) ;					

                        }
            	}
            }

            // draw line

            function drawLine(fromX,fromY,toX,toY) {

                  context.beginPath(); 
                  context.lineWidth = 1;
                  context.strokeStyle = lineColor; 
                  context.moveTo(fromX, fromY);
                  context.lineTo(toX, toY);
                  context.stroke(); 

            }

            // mouse

		document.addEventListener('mousemove', function(e){ 

		    mouse.x = e.clientX || e.pageX; 
		    mouse.y = e.clientY || e.pageY;

		}, false);

      }