26 Sept 2013

JavaScript Performance Tuning

Javascript , HTML5 , css3 ,php , sql , Web , design , development


Most server-side programming languages have tools to try and do performance tuning on applications written in them. With the popularity of Ajax based mostly applications and alternative rich-client HTML applications on the increase, more and more code is being written in JavaScript. So, however the heck do you go about troubleshooting performance problems for these kind of client-side serious applications written in JavaScript?

I faced this issue recently in 2 totally different applications wherever the Javascript library wasn't performing quick enough inflicting belated user expertise. I found out that Firebug is an extension for Firefox that can be used to do the performance tuning. The method this works is,


a) install Firebug (and restart the Firefox browser)
b) enable Firebug if not presently enabled
c) load the page that desires performance tuning
d) open up Firebug and within the console, click on Profile
e) begin using the UI controls within the page that have performance drawback
f) Click on the profile and see a table of all the function calls ordered by the number of time spent

This gives you a thought of the functions that are slow. The roughness of this report is just by function (thought it might are sensible if there's how to have line level roughness for a few hot-spot functions to pin-point the line number). From this, it’s doable to figure out what’s going on and go about optimizing. In my specific cases, the 2 things I had to try and do one in every app are

1) take away regular expression object creation and comparison from an inner loop
2) reduce the quantity of math.round calls

No comments:

Post a Comment