Perlin noise versus Simplex noise in JavaScript (final comparison)
…so after some hours of coding, debugging, testing, refactoring playing around I’ve got two nice noise implementations. Apart from the obvious speed increase the comparison is rather striking.
If you’re really interested, the first thing you should read (or skim through) is this pdf. What you don’t see in the example is that the simplex noise is a bit denser, which is probably caused by the triangulating way the noise is calculated. I’ve corrected this in the canvas output by multiplying it by 1.5 (that number is nothing more but a wild guess, it looks ok though).
Also very obvious is the range of the noise. The simplex noise low and high values approach 0 and 1 more often. I’ve run some tests between the two types to find the lowest and highest values with different octave and falloff values. The classical Perlin noise does go near 0 and 1 but it just seems more mediated, or the simplex one is more evenly spread. Altogether, the simplex version seems more chaotic than the classic. So in theory you’d need less octaves for a similar visual effect.
Click here to download the example, and feel free to comment or mail if you have any ideas for improvement.
Well, I guess I’ll go and port the simplex to as3 now.