javascript - : set all dom events at once, 和渐进性能哪个更好？

Question

一劳永逸地添加事件监听器是否更好？或者就在事件可能发生之前？

示例:假设您的 HTML 中有一个菜单，单击即可打开。此菜单中还有一个关闭按钮，单击该按钮即可关闭菜单。应设置关闭按钮上的事件监听器:在页面加载时还是仅在菜单打开时设置？

换句话说，是这样的:

function open() {
  closeButton.addEventListener('click', close);
  // ...
}
function close() {
  closeButton.removeEventListener('click', close);
  // ...
}
openButton.addEventListener('click', open);

比这更好/更快吗？

function open() {
  // ...
}
function close() {
  // ...
}
openButton.addEventListener('click', open);
closeButton.addEventListener('click', close);

我总是更喜欢选择简单性而不是性能，但这有什么区别吗？特别是当 UI 中有很多事件时？

Answer 1

当我们知道某个事件在某个相关事件之前不太可能发生时，我们应该推迟事件绑定(bind)。这样 DOM 就不会那么重了

至于简单性部分，即使延迟事件绑定(bind)，我们也可以拥有简化的代码版本