Производительность событий Jquery и использование памяти - PullRequest
3 голосов
/ 23 февраля 2012

Я работаю над полностью ajax веб-проектом, в котором содержимое раздела всегда генерируется с помощью манипуляций с dom или с помощью функции загрузки jquery. Я использовал «live», но очень заинтересован в том, чтобы отойти от «live» и использовать «on» для повышения производительности. Когда новая страница загружается, также необходимо загрузить новый набор привязок, требуемый для этого раздела. В html-разделах есть некоторые родительские dom (в основном обертки для разных областей содержимого веб-страницы), которые никогда не меняются, что позволяет мне связывать их со всеми будущими dom-элементами, которые будут созданы на странице.

С точки зрения компромисса между памятью и производительностью, какой обычно лучший способ обработки привязок событий?

1) После того, как новый раздел завершит загрузку своего html, привяжите все события, необходимые для этого конкретного экземпляра страницы, к элементам dom, которые будут удалены при изменении страницы.

2) Привязать каждое событие в самой первой загрузке страницы к элементам dom (не к документу, хотя это делает live), которые, как известно, существуют всегда.

1 Ответ

2 голосов
/ 23 февраля 2012

Проблемы с памятью у слушателей обычно решаются довольно легко (не храните большие куски данных в замыканиях, не создавайте циклические ссылки, не используйте делегирование и т. Д.).

Просто «живите»использует делегирование (насколько мне известно) - вы можете реализовать делегирование довольно просто без него, используя простые критерии, например, class или id, со слушателями на неизменяемых родительских элементах.Делегирование - это хорошая стратегия, когда она заменяет множество других слушателей, содержание постоянно меняется, и определение элементов, которые должны вызывать функции, просто.

Если вы следуете стратегии подключения многочисленных новых слушателей при каждом изменении содержимого, вам также придется отсоединять старых, когда они заменяются, в качестве стратегии уменьшения вероятности утечек памяти.Производительность (с точки зрения времени, затрачиваемого на присоединение и удаление прослушивателей как часть обновления DOM) обычно не так уж важна, если вы не выполняете сотни из них.

При делегировании родительский элемент прослушиваетevents, проверяет, является ли event.target/srcElement тем, который ему нужен для этого события, затем вызывает соответствующую функцию, возможно, используя call , чтобы установить значение this , если требуется.

Обратите внимание, что вы также можете просто включить встроенные прослушиватели во вставленный HTML, тогда вам не нужно беспокоиться об утечках памяти, делегировании или добавлении и удалении прослушивателей.Встроенные слушатели, использующие простой вызов функции, не сложнее, чем добавление любого другого атрибута (class, id и т. Д.) И не требуют дополнительного программирования на клиенте.Я не думаю, что встроенные слушатели когда-либо были проблемой утечек памяти.

Конечно, «ненавязчивый javascript» моб будет завывать, но они очень практичны, функциональны и надежны, не говоря уже о поддержке каждого браузера,когда-либо поддерживал JavaScript.

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