addEventListener ('mousemove', ...) на теле - насколько это плохо?

Question

У меня есть огромный документ, и мне нужно слушать все mousemoves на этом документе. Моя первая очевидная идея была addEventListener() на теле, но это может привести к некоторым проблемам с производительностью (вы знаете, пузырящие вещи).

В addEventListener() есть мифический параметр - useCapture. Я не совсем получаю внутреннюю работу по распространению событий в DOM, но выглядит многообещающе.

Будет ли лучше использовать фазу захвата, или это не стоит?

Answer 1

jQuery действительно имел live устарел из-за того, что bubbling does take time to reach the root (где live размещены все обработчики). Для небольших вещей это не проблема. Но если у вас есть глубокое дерево DOM или много чего происходит, это становится большой проблемой. Лучшая замена jQuery была on, так как вы можете решить, как далеко (или вниз) дерево может быть прикреплено обработчиком. Это ограничило, из каких элементов можно инициировать событие, а также количество узлов, которые могут пузыриться.

Большая проблема заключается в том, что работает в ответ на событие, так как mousemove срабатывает несколько раз во время движения. Привязка к телу означает, что код, который вы прикрепляли к событию, должен срабатывать при каждом перемещении мыши. Возможно, вы захотите ограничить действие, выполняемое в ответ на событие, или сохранить прикрепленный код как худой и как неблокирующий, насколько это возможно.

Answer 2

Фазовые работы захвата следующим образом: вместо того, чтобы кипящий от внутреннего DOM элемента вверх и наружу, захват начинается от окна и идет в

фазы захвата происходит до фазы восходящей цепочки, так что это удобно, если вам. хотите остановить распространение события до того, как он даже попадет во внутренние элементы DOM.

Это может быть проблемой, если это сделано непреднамеренно. Если вы установили mousemove на этапе захвата в теле и прекратили распространение этого события по какой-либо причине, ни один другой элемент DOM больше не получит событие mousemove.

Смотрите всегда поучительный QuirksMode пост на нем: http://www.quirksmode.org/js/events_order.html