I have code like the following:

oTable = $('#dataTable').dataTable({
    "sScrollX": "100%",
    "bScrollCollapse": true,
    iDisplayLength: -1,
    aLengthMenu: [[-1, 25, 50, 200, "All"], [10, 25, 50, 200, "All"]],
    aoColumnDefs: [
        { "sSortDataType":"dom-data-rk", "aTargets": ["sort-data-rk"] },
        { "sType": "date-uk", "aTargets": ["sort-date-uk"] },
        { "sType": "datetime-uk", "aTargets": ["sort-datetime-uk"] }
    ]
});

Is there a way I can time how long this code takes to execute using javascript or jQuery. Something like the Stopwatch method in C#?

I have code like the following:

oTable = $('#dataTable').dataTable({
    "sScrollX": "100%",
    "bScrollCollapse": true,
    iDisplayLength: -1,
    aLengthMenu: [[-1, 25, 50, 200, "All"], [10, 25, 50, 200, "All"]],
    aoColumnDefs: [
        { "sSortDataType":"dom-data-rk", "aTargets": ["sort-data-rk"] },
        { "sType": "date-uk", "aTargets": ["sort-date-uk"] },
        { "sType": "datetime-uk", "aTargets": ["sort-datetime-uk"] }
    ]
});

Is there a way I can time how long this code takes to execute using javascript or jQuery. Something like the Stopwatch method in C#?

• javascript
• jquery

• 1 It's not asynchronous, so just get the time before and after the function and pare! – adeneo Commented Aug 28, 2012 at 16:24
• Probably not, because it depends on the browser and partially on the hardware that's being used. – Bram Vanroy Commented Aug 28, 2012 at 16:24
• It's the browser time to render the javascript that I am wanting to time. – Angela Commented Aug 28, 2012 at 16:25

6 Answers 6

You can use console time and verify how long it takes.

console.time('profile');

for ( var i=0; i < 100000; i++) {
   var arr = new Array();
}

var time = console.timeEnd('profile');

the variable time will have the result in miliseconds example: http://jsfiddle/dadviegas/dV9rf/

for all browsers

var one=new Date();
for ( var i=0; i < 100000; i++) {
  var arr = new Array();
}
var two=new Date();

//Calculate difference btw the two dates
alert(two.getMilliseconds()-one.getMilliseconds());

i have added this solution in jsfiddle

Try this:

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

// do whatever you want, your code

var end = new Date();
var endTime= end.getTime();
var timeTaken = end - start;
alert('Execution time is : ' + timeTaken);

Is there a Date Object

var t = new Date;
//some processing here


console.log( new Date - t ); 

for IE, you need to use something like this

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

    oTable = $('#dataTable').dataTable({
     "sScrollX": "100%",
     "bScrollCollapse": true,
     iDisplayLength: -1,
     aLengthMenu: [[-1, 25, 50, 200, "All"], [10, 25, 50, 200, "All"]],
     aoColumnDefs: [
        { "sSortDataType":"dom-data-rk", "aTargets": ["sort-data-rk"] },
        { "sType": "date-uk", "aTargets": ["sort-date-uk"] },
        { "sType": "datetime-uk", "aTargets": ["sort-datetime-uk"] }
     ]
    });

    var end = new Date().getTime();
    var time = end - start;
    alert('Execution time: ' + time);

Here's an implementation of the key features of C# Stopwatch. It uses the new performance.now() function -- which is more accurate than getTime() -- where available.

var Stopwatch = function () {
    var startTime;
    var hasPerformance = window.performance && window.performance.webkitNow;

    return {
        start: function () {
            startTime = hasPerformance ? window.performance.webkitNow() : new Date().getTime();
        },
        end: function () {
            this.elapsed = (hasPerformance ? window.performance.webkitNow() : new Date().getTime()) - startTime;
        },
        elapsed: 0
    };
}

Usage:

var myStopwatch = Stopwatch();
myStopwatch.start();
/* code you want to time goes here */
myStopwatch.end()
alert("It took " + stopwatch.elapsed + " milliseconds!");

The builtin JS timers do not give good accuracy at all.

I love dynatrace AJAX edition. It is an IE plugin that gives very good timings.

http://ejohn/blog/deep-tracing-of-internet-explorer/