jquery - 我是否应该担心附加大量不需要的事件处理程序/监听器？

Question

我有一个网站，每个页面上都有许多 jQuery 事件处理程序，所有这些都在一个大型 .js 文件中。

这意味着对于任何页面，大多数事件处理程序都是针对不存在且根本不会使用的 HTML。

这会影响我的表现吗？

编辑:例如，大多数事件处理程序都会执行如下操作:

$(".page").on("click", ".notes .add", function(){ ... });

因为.on()适用于新元素，它是否总是会浪费处理能力，或者只有在ajax调用后DOM发生变化时才会生效？因此，为了进一步澄清我的问题，我想我应该将其分为两部分。

1. 如果出现性能问题，什么时候会发生？ (始终，在任何事件中，仅在 DOM 更改时，仅在加载时)。
2. 叮叮声足以让人担心吗？我该如何衡量这个？如果有一千个这样的听众， clang 会以秒、毫秒、微秒来衡量吗？我知道我可以加载页面并看看它的“感觉”如何，但我想在开始之前知道我是否构建了整个页面错误!

Answer 1

这很大程度上取决于标记，但一般来说，如果不使用不必要的事件处理程序，最好将其删除。

jQuery 事件使用 Sizzle 选择引擎附加到元素。这意味着对 $('a').click() 的调用仍然必须遍历整个 DOM 来搜索链接。由于您的元素不存在，因此不会绑定(bind)任何事件，但这并不妨碍 jQuery 必须搜索目标元素。减少 jQuery 工作量的一种方法是在绑定(bind)必要的事件之前测试已知元素(例如表单标记)是否存在。

if ($('form').size() > 0) { 
   // bind events for form here
}

如果使用 .on()、.delegate() 或 .live() 持久化事件，情况会变得更糟这些将消耗更多资源，因为它们被设计为绑定(bind)到所有元素，包括尚未创建的元素。