Creating a particle system with motion blur as a post-processing effect.
More details...
The particles positions are stored in an RGBA texture (xyz and previous z). The particles texture is updated in the CPU with a plasma function (several linear and circular gradients added), keeping the x and y in their gridded position, and moving the z axis.
The particles geometry are merged into a single geometry (no instancing). There's a shader for the diffuse data, and another for the motion data; both will be used in the motion blur pass. Both vertex shader take the particle position and move the sphere geometry to the correct location. The color fragment shader outputs color based on z position. The motion vertex shader calculates the direction vector and elongates the sphere in that direction (comparing the dot product of the vertex normal with the direction); its fragment shader then outputs the screen-space velocity of the particle.
The last pass, gathers both buffers and performs a blur averagin 20 samples from the color buffer in the direction of the data in the motion buffer.
Type helper.show(true) in the console to see the framebuffers.
Credits
Inspired by this animation and based on this Motion Blur as a Post-Processing Effect NVIDIA GPU Gem.
Coded using WebGL with three.js, ImprovedNoise.js and Maf.js