views:

106

answers:

3

My website has a jQuery script (from http://www.bitstorm.org/jquery/shadow-animation/) which constantly changes the colour of box shadow of various <div>s on the home page.

The animation is not essential but does take up a lot of CPU time on slower machines.

Is it possible to find out if the script will run 'too slowly'? I can then disable it before it impacts on performance.

Is this even a good idea? If not, is there an easy way to break up the jQuery animate?

+5  A: 

You could probably do it by timing a few times round a loop which did some intensive processing on page load but that's going to slow the page and add even further to CPU load so it doesn't seem like a great solution.

A compromise I've used in the past though was to make the decision based on browser version, e.g. IE6 users get simpler content whereas newer browsers with better Javascript performance get the animation. That seemed to work pretty well at a practical level. In practice, browser choice is a big factor in Javascript performance and you might get a 90% fit with what you want very simply just by taking that into account.

John Patrick
Still, the second idea will not be able to check the computer performance... Indeed, many owners of fast computers are using slow software just because they can't notice that it is slow.
mbq
Good idea but this plugin only works in new browsers anyway.
Pointy
Good idea. I don't have any data, but I'm willing to bet that users running IE6 are more likely to have less powerful computers than those running Chrome (for example)
Blair McMillan
In general yes, I'd think so. And in addition to that, browsers that have slow javascript engines aren't going to perform well for intensive tasks on any machine, so while it's not a 100% solution, disabling intensive, non-critical features based on browser version does help.
John Patrick
+1  A: 

You could do something like $(window).width() to get the browser width. Using this you could make the assumption that anything < 1024px wide is likely to be either a netbook, smartphone or old computer.

This wouldnt be nearly as accurate as timing a loop, but much more efficient.

Obviously its this rule's a generalisation and there are will be slow computers with > 1024px. But in general a 1024px + computer would typically be able to handle a fair bit of javascript (untill the owner puts on loads of software, virus scans and browser toolbars!)

hope this is useful!

Haroldo
+1  A: 

This may indirectly solve your problem. Pick a few algorithms and performance tests from this site http://dromaeo.com/ that seem similar to your jQuery plugin. Don't run comprehensive tests as they do on the site. Instead, pick fairly small and fast algorithms, and run them for an unnoticeable period of time.

Use a tiny predefined time span to limit how long these tests are allowed to run. Let's say if that span is 200 ms, and on a fast machine with browser A, you can get 100 iterations, while on some random user's machine, it's only able to complete 5 iterations, then you may want to consider disabling it on the user's machine. Tweak and tweak till you find the optimal numbers.

As a bonus, send all test results back to your server so you have a better idea of where your users lie in the speed spectrum. If a big majority of users are using slower computers and older browsers, then it just may make sense to remove the thing altogether.

Anurag