Need a way to destroy the Stage and Createjs object completely.

[Akimyou]

Hi.

I try to use Createjs in my SPA project. But in some page, I want to destroy Createjs completely.

I remove the DOM object and stage's children, event listeners.

Then there still have Detached DOM tree.

I have to manual set that stage.canvas = null; stage._eventListeners = null; ... , it can resolve this Detached DOM tree problem.

See that demo.

var backend = {}
var handle = {
   addA () {
       backend.domWrap = document.createElement('ul')
       backend.dom1 = document.createElement('li')
       backend.dom2 = document.createElement('li')
       backend.dom3 = document.createElement('li')
       backend.dom4 = document.createElement('canvas')
       backend.domWrap.appendChild(backend.dom1)
       backend.domWrap.appendChild(backend.dom2)
       backend.domWrap.appendChild(backend.dom3)
       backend.domWrap.appendChild(backend.dom4)
       document.body.appendChild(backend.domWrap)
   },
   addB () {
     backend.domWrap = document.createElement('ul')
     backend.dom1 = document.createElement('li')
     backend.dom2 = document.createElement('li')
     backend.dom3 = document.createElement('li')
     backend.dom4 = document.createElement('canvas')
     backend.domWrap.appendChild(backend.dom1)
     backend.domWrap.appendChild(backend.dom2)
     backend.domWrap.appendChild(backend.dom3)
     backend.domWrap.appendChild(backend.dom4)
     backend.stage = new window.createjs.Stage(backend.dom4)
     document.body.appendChild(backend.domWrap)
   },
   delA () {
     document.body.removeChild(backend.domWrap)
     destroyStage(backend.stage)
     destroyCreatejs(window.createjs)
     backend = null
     window.createjs = null
   },
   delB () {
     document.body.removeChild(backend.domWrap)
     backend = null
   }
}

function destroyStage (stage) {
  stage.removeAllChildren()
  stage.removeAllEventListeners()
  stage.canvas = null
  stage._eventListeners = null
}

function destroyCreatejs (createjs) {
  createjs.DisplayObject._hitTestCanvas = null
}

window.handle = handle

Want to have a right way to destroy the Stage and Createjs object completely.

Thanks.

[adamantivm]

I've been profiling a nasty memory leak where the root cause is this as well. I'd love to have a proper way to get the createJs object properly cleaned-up.

[hilts-vaughan]

In the past when dealing with these problems I've loaded the thing into an iframe. Is this an option for you?

…

On Thu., Jan. 30, 2020, 10:27 p.m. Julian Cerruti, ***@***.***> wrote: I've been profiling a nasty memory leak where the root cause is this as well. I'd love to have a proper way to get the createJs object properly cleaned-up. — You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub <#913?email_source=notifications&email_token=AAIHPJ5MYMYUWG6DMEHLK3DRAOLARA5CNFSM4D7QHOOKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEKNLSVY#issuecomment-580565335>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AAIHPJYJP6ZHWMO3UUUMSRLRAOLARANCNFSM4D7QHOOA> .

[adamantivm]

Thank you for the suggestion! I hadn't though of that.
Unfortunately for my case that would be very difficult to do, as this is part of a very large React application.

I think I found a solution though. I found a way to properly clean-up the Stage object from outside it by doing the following:

myStage.enableMouseOver(-1);
myStage.enableDOMEvents(false);
myStage.removeAllEventListeners();
myStage.removeAllChildren();
myStage.canvas = null;
myStage = null;