Hi guys,
I am customizing the e-commerce cms Opencart for my site and I have recently tried to do some pretty cool JQuery effects, one in particular Jticker makes it look as though the text is being written by a typewriter.
However, I am getting poor performance from this effect on Firefox. I want it to type pretty quickly so that the user isn’t waiting too long to see the content but firefox is taking ages and I suspect its down to either the performance of my hosting or to javascript. I have set the effect to its maximum speed and Chrome and Opera, Safari, even IE render it out really quickly.
Could anyone give me tips on optimizing a site for best JS performance.?
The site does load up a few scripts but not excessive amounts and they are all minified. As you are all aware, firefox is usually one of the best browsers and does not usually have performance issues.
My hosting is CRAP too which doesn’t help. Could I be looking for a js performance issue that really isn’t there but is due to the download speed of my hosting?
About the only way to investigate issues such as this is for us to explore the issue from a web page that exhibits the problem.
Here you go, its unfinished from an aesthetic point of view but all of the scripts which need to run are running:
http://www.wavemobilephones.com/index.php?route=product/product&path=60_64&product_id=1232
Some of the js is written by me but lots of it is written by the author of the original template which I am customising so its not all my fault! 
Firefox 11.0 in particular is exhibiting this slow performance
I also noticed that JQuery tools and Jquery are both included and as one contains the other I do not need both but I cannot seem to download the latest JQuery tools because their site is down. Do you know where I can get the latest version from?
Disable or remove other scripts on the page that are unrelated to the jticker. Does the performance then improve?
Hi Paul,
Have just done that and it’s not improved. Can you see it too? I have 2 laptops with 2 different firefox 11 and it’s occuring on both
Firefox 3.6 not great with this either and I also have speed/performance issues with another JQuery plugin, Zoomer gallery. All other browsers execute these effects flawlessly. Even IE7 and 8 keep up ok
The purpose of that was to reduce the scripting demands of the page down to only the ticker.
Does this demo page for the jticker have the same slowdown problem for you?
http://webdev.stephband.info/jticker/
Not at all its rapid. I am very keen to learn this optimizing/fault finding technique and appreciate your help. I have left the page with only JQuery lib and the ticker for now. Currently when I come across such a problem I can get as far as removing different scripts to see which one is causing the problem but after that I don’t have the confidence.
OK so the solution to this is that all of my parent elements are floated. There are other documented cases online also with regards to issues with JQuery animations and floated elements. Believe me I have explored every other option, disabled every script on the site, deleted every part of the page except the offending elements and it is not until I changed the positioning on those parent elements, (not just the parent but it’s parent too) to absolute or relative that the animation speeds up.
Then when I replaced all of the original content and enabled all the other scripts it was working fine.
Very annoying tho as I had worked out a lovely floated positioning for the page and more annoying that all of the other browsers except Firefox are fine. This bug occurs on versions as new as Firefox 11 so anyone else who reads this, just save yourself the headache and develop a workaround using something else other than floats.