Question

我目前正在构建一个相当大的基于Web的应用程序。我的工作是使用JavaScript和jQuery构建界面。最终，应用程序将使用Ajax，C＃和SQL。因此，在任何时候都会发生很多事情。

我需要听一个事件。目前我正在使用mouseover和mouseout事件的组合来触发此事件，但它并未涵盖我的所有低音。

因此我正在考虑使用JavaScript间隔计时器来定期检查事件是否应该触发。我这样做是犹豫不决的，因为害怕我的代码太慢了。

我的问题是这会减慢我的其余代码的速度？

我意识到这取决于相应函数中运行了多少代码，所以这里有一个快速列表：

我使用e.pageX和e.pageY获取鼠标坐标。
我使用document.elementFromPoint检查您当前悬停在的元素。
我检查上面提到的元素是否有具有.closest
如果是，则触发事件。

总而言之，我想知道如果每隔几毫秒执行上述操作会显着减慢我的应用程序。

非常感谢任何建议。

Answer 1

更多的评论而不是答案，但评论框太多了。

当然这应该有效：

$('.myClass').on('click', '*', function () {
    ...
});

或

$(documnt).on('click', '.myClass *', function () {
    ...
});

取决于.myClass是在DOMContentLoaded创建还是由AJAX创建。

Answer 2

Here is an example Javascript间隔计时器如何减慢应用程序的速度：

HTML：

Function calls: <span id="info"></span>
<br>
<input type="text"/>

使用Javascript：

$(document).ready(function() {
    window.setInterval(function() {
        foo();
    }, 13);
});
var calls = 0;

function foo() {
    calls++;
    $("#info").html(calls);
    fib(35); // calculate fibonacci numbers
}

function fib(n) {
    return n < 2 ? n : fib(n - 1) + fib(n - 2);
}

尝试在文本框中输入一些文本，您将看到应用程序无法响应。根据您PC的硬件，您将看到输入的文本具有或多或少的延迟。更改fib()函数的参数将使应用程序“更快”（较低的数字作为参数）或“较慢”（较高的参数数量）。 A low number（意味着函数快速执行）不会降低应用程序的性能。

因此，对于您目前的情况，我认为间隔计时器不会显着减慢您的应用程序。但有几点需要考虑：

该应用程序是否仅用于具有快速硬件的桌面浏览器？
该应用程序是否也被移动设备/平板电脑使用？这些往往表现更差。
目前，间隔计时器只做很简单的事情。但未来呢？也许有时候会增加越来越多的功能，因为这是开发人员最简单的方法。

因此，如果可能的话，我建议避免使用间隔计时器。

计时器事件会在JavaScript中减慢我的代码的速度

2 个答案: