javascript - Removing backbone views but DOM node count keeps going up? -

i have quiz application built in backbonejs, have 3 views. quizview shows overall progress , back/next buttons. pageview contains group of questions , questionview each question.

when user goes next page in quiz remove current pageview calling destroy function calls backbone's remove() on page , questions. (all listeners attached listento)

it's expectation after dom nodes should not longer reflected in memory timeline. i've attached view of dom node count chrome dev tools , can see goes go new pages.

i took heap snapshot , when @ detached dom items have 1 item (the div container page) has single item in retaining tree. i'm assuming why not being collected.

can provide insight @ why dom node count continuously goes up?

also destroy function in pageview:

destroy: function(){     console.log("pageview :: destroy " + this)     _.each(this.childviews, function(view){         view.remove();     });      this.remove(); } 

as long have reference between objects won't eligible garbage collection. these views "zombie views". how deal such cases explained in post:

zombies! run! (managing page transitions in backbone apps)

---

by

view.remove() removes view dom, , calls stoplistening remove bound events view has listento'd.

you removed events: {} , dom view. however, events listening on trigger , model events like

this.model.on('reset', this.render, this) 

are still alive , holding reference view, making ineligible garbage collection.