Can someone help me in optimising this code?

Question

My intention is to zoom into the fractal, and I need the code to be as fast as possible. But I have no idea of how to optimize it.

https://code.sololearn.com/WW5k30TdVULU/?ref=app

Answer 1

Make a WebGL shader so your Mandelbrot fractal is compiled to machine code that runs directly in your video card. This would run multiples faster but it won't work on all browsers and devices.

Here are some examples of Mandelbrot viewers implemented using WebGL shaders:
- http://jsfiddle.net/wx6s0y3v/1/
- https://www.youtube.com/watch?v=W1QLASmQW6Y is a video tutorial on how to write this type of Mandelbrot viewer

Your current code looks pretty fast and efficient to me considering it is written in JavaScript. If you find it taking 500ms or some time a user would notice, you could manage some of the slowness in creative ways.

You might be interested in looking at how I made a fractal viewer at https://code.sololearn.com/WVhoMHzy3K81/#html. It has a Mandelbrot option. I didn't make the algorithm much more efficient than your code but I did break up the drawing process using a timer and a task queue to keep things fairly responsive while the fractal gets drawn over several seconds from low/heavily pixelated resolution to a very high resolution.

Answer 2

I created this interactive Mandelbrot viewer that uses a WebGL shader to draw the Mandelbrot in realtime. It is redrawn very quickly for a smooth zoom animation.

This might be useful if you still want ideas for optimizing yours:
https://code.sololearn.com/Wyd87dQXWe96/

Answer 3

I recommend you to look up on Google ways to increase the execution of my code in js

Answer 4

I eventually created a Mandelbrot shader here:
https://code.sololearn.com/Wyd87dQXWe96/
It renders fast enough to do a smooth zoom animation.

That applies my recommendations from the previous answer. The shader code is in the HTML tab.