下面是一个用于时间性能的可重用类。示例包含在代码中:

/*
     Help track time lapse - tells you the time difference between each "check()" and since the "start()"

 */
var TimeCapture = function () {
    var start = new Date().getTime();
    var last = start;
    var now = start;
    this.start = function () {
        start = new Date().getTime();
    };
    this.check = function (message) {
        now = (new Date().getTime());
        console.log(message, 'START:', now - start, 'LAST:', now - last);
        last = now;
    };
};

//Example:
var time = new TimeCapture();
//begin tracking time
time.start();
//...do stuff
time.check('say something here')//look at your console for output
//..do more stuff
time.check('say something else')//look at your console for output
//..do more stuff
time.check('say something else one more time')//look at your console for output

你可以使用控制台。firebug中的配置文件

我同意，感知到的表现真的是最重要的。但有时我只是想知道哪种方法做某事更快。有时这种差异是巨大的，值得了解。

你可以使用javascript计时器。但我通常会得到更一致的结果使用本机Chrome(现在也在Firefox和Safari) devTool方法console.time() & console.timeEnd()

我如何使用它的例子:

var iterations = 1000000;
console.time('Function #1');
for(var i = 0; i < iterations; i++ ){
    functionOne();
};
console.timeEnd('Function #1')

console.time('Function #2');
for(var i = 0; i < iterations; i++ ){
    functionTwo();
};
console.timeEnd('Function #2')

更新(4/4/2016):

Chrome金丝雀最近增加了行级别剖析开发工具的来源选项卡，让你看到每一行执行了多长时间!

我们总是可以通过简单的date对象来测量任何函数所花费的时间。

var start = +new Date();  // log start timestamp
function1();
var end =  +new Date();  // log end timestamp
var diff = end - start;

性能测试最近成了一个流行词，但这并不是说性能测试在QA中不是一个重要的过程，甚至在产品发布之后也不是。当我开发应用程序时，我使用了许多不同的工具，其中一些是上面提到的chrome Profiler，我通常会查看一个SaaS或一些开源的东西，我可以开始工作，然后忘记它，直到我收到警告，说有些东西出了问题。

有很多很棒的工具可以帮助您关注性能，而不需要您跳过一些基本的提醒设置。这里有一些我认为值得你自己去看看。

Sematext.com Datadog.com Uptime.com Smartbear.com Solarwinds.com

为了画出更清晰的画面，这里有一个关于如何为react应用程序设置监控的小教程。

我有一个小工具，可以在浏览器中快速运行小的测试用例，并立即得到结果:

JavaScript速度测试

您可以在测试过的浏览器中测试代码并找出哪种技术更好。