When I implemented the WebGL backend couple of weeks ago, I mentioned that the performance improvement is not as good as it should be. Yesterday I spent some time on that and figured out how to make effective use of Vertex Buffer Objects in WebGL. After correcting the code the UI speed improved tremendously in Google Chrome. If you are into numbers: a code path that was taking nearly 9ms, now only takes less than a millisecond. If you have latest Chrome with WebGL enabled, you can see it yourself. On Firefox 4 too the WebGL speedup helps, but the UI is still not as fast as Chrome. Unfortunately Firebug profiling isn’t working for me on Firefox 4, so I will have to get back to it later. May be it’s a bug in latest nightly build of Firebug or Firefox.
In addition, I did some profiling with Canvas 2D rendering too. Few days back I read in the comments of Pre3D source code that stroke() calls can be expensive, so using them to fill the gaps between polygons is not such a good idea. I was doing exactly the same. Pre3D uses a clever trick to avoid stroke()s. It expands the polygons a bit and uses the single fill() call to draw over the gaps. I tried it and it gave the same results. The new technique improves the speed of drawing routine to Canvas2D. The speedup due to this may not be significant, but it’s there.
That’s all for now. More coming soon.