Остановить всплытие событий - увеличивает производительность? - PullRequest
4 голосов
/ 16 марта 2012

Если я не возвращаю false из обратного вызова события или не использую функцию e.stopPropagation в jQuery, событие всплывает в DOM.

В большинстве случаев мне все равно, пузырится событие или нет. Как и в этом примере структуры DOM:

​<div id="theDiv">
    <form id="theForm" >
        <input type="submit" value="submit"/> 
    </form>
</div>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

Обычно у меня нет нескольких вложенных обратных вызовов, например:

$('#theDiv').submit(function() {
    alert('DIV!');
});
$('#theForm').submit(function(e) {
    alert('FORM!');
    e.preventDefault();
});​

Fiddle
Это DEMO показывает submit всплывающие сообщения о событиях на <div>!
Для меня не имеет значения, остановлю ли я Распространение или просто предотвратим дефолт.

В этих сценариях Если я остановлю распространение, получу ли я выигрыш в производительности?

Ответы [ 3 ]

4 голосов
/ 16 марта 2012

Преимущества в производительности? Да, есть небольшие преимущества, как указано в этом тесте производительности между jQuery live() и on(). Как заметил @Joseph, разница между ними заключается в том, что live распространяется по всему дереву, а on() идет только к ближайшему общему родителю.

В этих тестах показано, что on() может превзойти live() до 4 раз. На практике это, вероятно, все еще не стоит разбивать волосы на части, но если у вас очень глубокие html-структуры и множество триггеров событий, я думаю, что разница в производительности при остановке распространения может стоить.

2 голосов
/ 16 марта 2012

вот сравнение между on() и live(), которое связано с пузырьками и причиной, по которой jQuery заменил live().проблема с live() заключалась в том, что к документу были прикреплены события, из-за которых длинный путь вверх по дереву находил обработчик.Что вы можете сделать с on(), так это то, что вы можете прикрепить обработчик к ближайшему общему родителю, что позволит избежать длительного перемещения по дереву в поисках обработчика - что означает более высокую производительность.собственные тесты для проверки.

1 голос
/ 26 апреля 2012

Этот тест показывает, что есть преимущество в производительности для раннего уничтожения события.(15% -30%) И, вероятно, будет большая разница в сложных DOM.Также интересно отметить, что захват прослушивателей событий кажется немного быстрее, чем всплывающих прослушивателей событий, независимо от того, что вы делаете с событием после обработки.Странно, но интересно;Я тестировал только в одном браузере, хотя

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...