Functions speeding up over time

Question

I'm looking at benchmarking the 3 main browsers with regard to how quickly they can run JavaScript using a fairly trivial piece of code. My JS is:

<!DOCTYPE html>
<html>

<body>

  <h1>JS Test page</h1>

  <p>The button below will test the speeed of your browser</p>
  <button onClick="testBrowser()">Test browser</button>
  <p id="TimeArrayP"></p>
  <script>
    function testBrowser() {

      var timeArray = new Array();

      for (i = 0; i < 100; ++i) {

        var start = new Date().getTime();

        var number1;
        var number2;
        var number3;
        var number4;

        var result1;
        var result2;
        var result3;

        var endresult;

        for (e = 0; e < 50000; ++e) {

          number1 = Math.floor((Math.random() * 100) + 1);
          number2 = Math.floor((Math.random() * 100) + 7);

          result1 = ((number1 + number2 / number1 * number2) * (number3 + number2) / number1);
          result2 = ((number2 + number3 / number1 * number4) * (number3 + number1) / number4);
          result3 = ((number3 + number4 / number4 * number2) * (number2 + number3) / number2);

          endresult = ((result1 * result2 * result3) / (result1 + result2 * result3) + result1 / result2);

        }

        var end = new Date().getTime();
        var time = end - start;


        timeArray[i] = time;

      }

      timeArray.toString();
      document.getElementById("TimeArrayP").innerHTML = timeArray;

    }
  </script>

</body>

</html>

On Chrome and IE, the run time starts higher than it ends, with every run past about the second one being a pretty consistent time, and lower than the first.

However, Firefox takes significantly longer to run this code (about 180 milliseconds on Firefox compared to roughly 30 on IE and Chrome), and does not see that same reduction in run time that IE and Chrome does.

What is the explanation for both Firefoxs lengthy runtime, and the reduction in the time it takes to iterate through IE and Chrome?

I am using IE9, Firefox 32.0.1 and Chrome 37.0.2062.120.

@bitoiu IE9, Firefox 32.0.1 and Chrome 37.0.2062.120. I have no idea what JSPerf is or how to use it I'm afraid. — Dr R Dizzle, Oct 14 '14 at 09:47
[This answer might be helpful for you](http://stackoverflow.com/questions/1096907/do-browsers-parse-javascript-on-every-page-load/9261355#9261355), although it may now be slightly out of date. Especially note the JIT compiler in Firefox. — Jivings, Oct 14 '14 at 09:59
http://jsperf.com/ you write a piece of JS code and it does a series of runs to do performance tests. you can then run it on several browsers. It's more scientific lets say. — bitoiu, Oct 14 '14 at 10:04

score 2 · Accepted Answer · edited May 23 '17 at 12:20

2

It may have to do with resetting the call stack and caching. Here's an interesting talk about the way call stacks work in javascript. The link to an SO-answer @Jiving gave in the comments to your question is also very useful.

If you want to measure pure calcalation time, running it in a web worker may be viable. I moved your scripting to it, see this jsFiddle.

Furthermore, replace

for (i = 0; i < 100; ++i) // and
for (e = 0; e < 50000; ++e)

into

for (var i = 0; i < 100; ++i) //and 
for (var e = 0; e < 50000; ++e)

to prevent polluting the global scope.

edited May 23 '17 at 12:20

Community

1
1

answered Oct 14 '14 at 10:13

KooiInc

104,388
28
131
164

I'm more interested in the difference between how the browsers handle JavaScript, rather than calculation time, so this is actually interesting to me. I'll be marking this as the answer unless something better comes along in the next few days. +1 – Dr R Dizzle Oct 14 '14 at 10:40

Functions speeding up over time

1 Answers1