How can I test the user's computer's processing power using Javascript?

Question

I made a pretty CPU intensive webpage with lots of CSS3 and Javascript. I want to use Javascript to test if the user's computer is capable of handling the scripts. I think a possible method is to run some CPU intensive scripts and see how long it took. However, I don't know how to actually implement this.

Here's the webpage: http://leojiang.me/ (3D cube only viewable in webkit browsers).

Answer 1

You can profile how long it takes to render a frame or a couple of frames that should give you and idea of what fps would be on the client.

var StartTime = new Date().getTime();
BenchMarkTestFunction(); // render frame for example
var EndTime = new Date().getTime();
var ElapsedMilliseconds = EndTime - StartTime;

var AcceptableTime = 1000; // one second
var IsGoodPerformance = ElapsedMilliseconds < AcceptableTime; // some number being acceptable performace

if(!IsGoodPerformance) {
  alert("Sorry your browser is not good enough to run this site - go somewhere else");
}

You can determine what the AcceptableTime should be by testing your site on different browsers/devices and seeing how it performs and what the value for ElapsedMilliseconds was.