【问题标题】:JSPerf test results get slower as the tests run?JSPerf 测试结果随着测试的运行而变慢?
【发布时间】:2015-03-15 16:15:12
【问题描述】:

背景:所以,我试图做一个测试,看看使用 jQuery 的on.() 绑定“点击”事件的三种方法的性能差异。我看到了一些相当大的差异(比我预期的要大),当一位同事运行结果时,他注意到,如果你改变测试运行的顺序,结果会改变,但同样“不正常”。


所以,我决定做一个非常简单的测试:

1) 一个父 <div> 包含 100 个子 <div>s,每个子都只有一个数字 (1-100) 和 class 值“目标元素”。

2) 每个元素都有一个绑定到它的click 事件,使用这个:

$(".target-element", "#context1").on("click", logClick);

3) click 事件只是将文本值设置为局部变量:

function logClick() {
     var sTextVal = $(this).text();
}

4) 然后,我设置了一个“触发”函数来调用所有子 <div>s 的点击次数:

function triggerClicks(context) {
    $(context).find(".target-element").each(function() {
        $(this).click();
    });
});

5) 然后,我设置了 3 个测试运行,它们都调用 EXACT 相同的测试:

运行 1 ---> triggerClicks("#context1");

运行 2 ---> triggerClicks("#context1");

运行 3 ---> triggerClicks("#context1");

您可以在此处查看测试:http://jsperf.com/jsperf-perf-test

在我测试的所有浏览器中,结果都大不相同,随着运行的继续,速度越来越慢:

Chrome 41

Run 1 ---> 59.91 Ops/sec (±6.55%) - fastest
Run 2 ---> 32.72 Ops/sec (±5.06%) - 45% slower
Run 3 ---> 23.69 Ops/sec (±3.39%) - 59% slower

Firefox 36

Run 1 ---> 52.69 Ops/sec (±10.21%) - fastest
Run 2 ---> 26.70 Ops/sec (±6.38%) - 48% slower
Run 3 ---> 15.95 Ops/sec (±24.55%) - 73% slower

IE 9

Run 1 ---> 26.98 Ops/sec (±14.43%) - fastest
Run 2 ---> 11.77 Ops/sec (±8.89%) - 54% slower
Run 3 ---> 7.54 Ops/sec (±6.85%) - 70% slower

那么我在这里错过了什么?我意识到这是一个重复性的测试并且正在处理很多元素,但这不应该对运行结果产生太大影响。任何人都可以看到为什么会因为我的代码而不是 JSPerf 出现严重问题而发生这种情况的任何原因吗?

【问题讨论】:

    标签: javascript jquery jsperf


    【解决方案1】:

    如果您查看表单中准备代码字段旁边的帮助文本:

    每个计时测试循环之前运行,在计时代码区域之外

    这意味着代码在每个测试用例之前运行,而不仅仅是一次。因此,在第二个测试用例中,您将有两个事件处理程序附加到每个元素,在第三个测试用例中附加三个。

    这就是为什么在准备字段下方有一个“拆卸”字段的原因:它应该用于撤消您在设置中所做的事情,以避免出现这种情况。如果您将此添加到拆解中:

    $(".target-element", "#context1").off("click");
    

    然后在添加新的事件处理程序之前删除现有的事件处理程序,并且测试需要大约相同的时间来运行。

    Updated version here.

    【讨论】:

    • 哦,哇。 . .有趣的。那段文字有点令人困惑。 . .在该部分的前面,它指示用户添加“将在测试中使用的变量、函数、数组或其他对象”,因此,如果您不密切注意(显然,我没有: D ),您可能会错过这种区别。
    • 而且,我想,另一种选择是将该代码放在“准备”部分,在 <script> 标记内,这将使它只运行一次,并且不需要拆解任务。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2013-09-08
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多