Какова цель $ .cache в jQuery?

Question

Я вижу, что обработчики событий, зарегистрированные через .on(), хранятся в $.cache. Я также вижу, что обработчики событий также хранятся в $(elem).data().

Объекты, хранящиеся в $.cache, относятся к узлам DOM, на которых зарегистрированы события. Это приводит к утечке памяти при отсоединении узлов DOM, и это делает обязательными .off().

У меня есть ситуация, когда я не знаю, когда узел DOM (к которому я привязал обработчик события) отсоединяется. Хотя я могу хранить ссылку на этот узел DOM в своем коде и вызывать .off() для очистки, это не кажется приятным, потому что не просто знать, когда удаляется узел DOM.

Каков наилучший способ для этого?

Answer 1

«Каков наилучший способ для этого?»

Если вы собираетесь использовать JQuery, вы должны использовать его API для удаления элементов, и вы должны использовать правильные методы, в противном случае, как вы заявили, вы будете иметь утечку памяти.

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

Вы должны убедиться, что jQuery удалены из любого элемента, затронутого jQuery. Также есть некоторые данные, хранящиеся в $.cache, которые вы явно не задали. Это означает, что все элементы должны быть удалены с помощью jQuery, а не только те, что вы думаете, что могут иметь данные.

---

"Какова цель $.cache в JQuery?"

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

Если вы удалите элемент без jQuery, связанные данные в $.cache останутся без работы.

Целью этого подхода было предотвращение потенциальных утечек. К сожалению, это потенциально создает более серьезные утечки.

Answer 2

Я столкнулся с аналогичной ситуацией, когда нокаут используется для добавления и удаления домиков из документа. Однако jquery используется для подключения прослушивателей событий к этим деревьям. Когда нокаут удаляет элементы dom из документа, слушатели не отключаются, поэтому дерево доминирования никогда не имеет права на сбор мусора. Мы добавили функцию очистки, которая тратит через jquery $ .cache каждый раз при изменении хеша и находит даже обработчиков, которые привязаны к деревьям, которые не находятся в документе. Затем он отталкивает слушателей, тем самым делая дерево домиков подходящим для сбора мусора и фиксируя большую часть утечек, которые мы наблюдаем, то есть круглые поездки вокруг приложения, используемого для утечки 13 МБ, теперь он протекает только с 3 МБ с этими изменениями на месте.

for (var i in $.cache) { 
      if ($.cache.hasOwnProperty(i)) { 

       if ($.cache[i].handle && $.cache[i].handle.elem && document !== $.cache[i].handle.elem && !jQuery.contains(document, $.cache[i].handle.elem)) { 
        //we have an event handler pointing to a detached dom element! 
        //this is a memory leak as this detached dom element cannot be garbage collected until 
        //all references to it are removed. So lets delete the event handler to get memory back! 
        var orphan = $($.cache[i].handle.elem); 
        $('body').append(orphan); 
        orphan.off(); 
        orphan.remove(); 
        orphan = null; 
       } 
      } 
     }