Opened 9 years ago
Last modified 6 years ago
#10667 open bug
Draggable: $.ui.ddmanager.current not released on draggable _destroy
Reported by: | eshcharc | Owned by: | |
---|---|---|---|
Priority: | minor | Milestone: | none |
Component: | ui.draggable | Version: | 1.11.1 |
Keywords: | Cc: | ||
Blocked by: | Blocking: |
Description
In the days of client side frameworks and SPAs, considerations need to be made regarding client side page switch and optimizations and cleaning of assets.
When we examined and profiled our SPA on a page switch scenario, we've noticed that a jQuery-UI plugin is holding a whole element tree. A further examination led us to a draggable and the "global" $.ui.ddmanager.current.
It seems that when a draggable is being destryed via _destroy, $.ui.ddmanager.current which is linked to this draggable, is not taken care of and keep a reference to the draggable and all of its tree elements. When a client side framework is involved, that makes it worse.
That can quite easily be treated.
Change History (4)
comment:1 Changed 8 years ago by
Component: | ui.core → ui.draggable |
---|
comment:2 Changed 8 years ago by
Status: | new → open |
---|---|
Summary: | $.ui.ddmanager.current not released on draggable _destroy → Draggable: $.ui.ddmanager.current not released on draggable _destroy |
comment:4 Changed 6 years ago by
I have observed this in an ember.js application (v2.12.2). The feature in question was too complex to easily reproduce in ember-twiddle. The workaround mentioned by merildev did not work for us. Instead I had to add following function and invoke after the user initiated the state that caused the orphaned widget element:
function garbageCollectWidget() { try { const el = jQuery.ui.ddmanager.current.element; el.off(); el.remove(); delete jQuery.ui.ddmanager.current.element; } catch (err) { } //eslint-disable-line no-empty }
Same problem here.
I use Backbone for my SPA, when the view which contains the draggable element is closed, the DOM tree should be deleted. However, I can see a leak and my view appears as a detached DOM tree with some references in the JS code (jQuery UI).
Quick and dirty solution: If I do a 'delete $.ui.ddmanager.current;' when the view is closed, the reference is removed and the garbage collector is able to delete the DOM nodes.