How to unlink when referenced node dont exist anymore.

[Deliber]

Hi Boris, we are using jsRender and JSView for an entire portal exclusively based on templates and datalink to update the data, your libraries are excellent, congratulations!

But we have a problem: when some DOM nodes previously linked with JSView ( with this call $.link.someTemplate(parentNode, data) ) is removed, JsView maintain referenced memory for page life.

I have two question:

1. If I link two times the same node, this reference overwrite the previous link directive?

2. For remove reference (when I destroy one or more DOM node), the best way is $.observable().unobserve()?

There is a way for getting a reference (to unlink in second time certain DOM node) when the node dont exist anymore?

Thanks for the great work you are doing.

Thank you

[BorisMoore]

Hi,

Yes, generally, removing DOM nodes should trigger disposal by JsViews automatically.

If you do $.link.someTemplate(parentNode, data) and then you call $(parentNode).empty() that should cause JsViews to remove the bindings and the object references. Or if you actually remove parentNode, as in $(parentNode.parentNode).empty(), for example, that should of course also remove those bindings and references.

If this is not the case (with the latest JsViews version) can you provide a test case to show that?

BTW there are a lot of unit tests in JsViews which address disposal. You can take a look at them.

1. You can call $.link.someTemplate(parentNode, data) multiple times, and each call will dispose of the previous bindings and create new ones.

2. As explained above, removing the node should be sufficient, so you don't need to call unobserve or unlink...

[BorisMoore]

@Deliber: I will close this now, since I assume your issue is resolved. If you still see JsViews maintaining referenced memory inappropriately, can you reopen, and provide a test case to show the issue? Thanks.

[Deliber]

Hello Boris,
i apologize for the delay with which I answer.

I saw your last commit with the fix for the memory leak, unfortunately I still have
something wrong with the memory.

I'll try to give you an example.

The main problem is the following:
In my application may frequently happen that some portions of the code are replaced.
This can happen for an innerHTML (or html() from jQuery) or for a change of content within a IFrame,
in both cases the result is always the same, memory leak.

We approach the cases individually.

1. Code replaced
   Sometimes a portion of code (containing a node with a link) is replaced.
   In this case, the linked node is lost but appears to remain a reference within JSView,
   causing a memory leak (I hope I'm wrong).

2. Refresh Iframe
   The real problem is when i refresh, redirect or change the code of an Iframe. All
   jsRender,jsView and all the template, are loaded on the main window, for performance problem.
   In my code the memory leak ends when i delete the jsView code for link (in my case memory leak reaches 10Mb~ on IE9).

In the file linked there are the above two examples (tested on IE9).

http://www.4shared.com/get/RyzKAALY/LeakExample.html

I have two question:

1. Can you give me confirmation that even in the case of the examples, JSView will dispose the bindings?

2. Is there a way to force JSView to remove links to which reference is lost?

3. Is there a way to force JSView to remove links starting from the data?

Thank you for your patience, are available for any clarification.

P.S. I do not think you have permission to reopen the issue.

[BorisMoore]

@Deliber: Can you send me the zip to borismoore@gmail.com, or create a jsfiddle to show the issue? (4shared requires me to install software :( )

[BorisMoore]

@Deliber:
For 1) if DOM nodes are removed using jQuery methods, then associated JsViews event bindings etc. will be correctly disposed, and there should be no memory leaks. You should not deleted DOM nodes directly (if they have been 'data-linked' by JsViews) using node.innerHTML = newHtmlContent; for example. This will indeed cause memory leaks. In this example you can use $(node).html(newHtmlContent);

2. There is an unlink API. See the various example in the unit tests, such as here: https://github.com/BorisMoore/jsviews/blob/master/test/unit-tests/tests-jsviews.js#L2288

3. You can use $.off(...) - for the "propertyChange" or "arrayChange" events. Or you can use $.observable.unobserve(...). See examples in the unint tests such as here: https://github.com/BorisMoore/jsviews/blob/master/test/unit-tests/tests-jsviews.js#L2453

Looking at your zip, I don't see any memory leak for the case where you use jQuery APIs without IFrames. If you use IFrames, you will need to ensure the correct APIs are getting called in the right context. I don't have built-in support for cross IFrame work where JsViews in one frame is driving data-linking in another...