Understanding alloy structucture

Question

I am developing app with titanium alloy. I have multiple xml file. Every xml file has got same view and every view id's and function is same. this approch is correct or must I assign different id and different named function for all object for prevent memory leak. I mean every xml's proxy is same or different on memory?

home.xml

<Alloy>
    <Window id="home">
<View id="Container" onTouchend="fooFunction"> </View>
</Window>
</Alloy>

detail.xml

<Alloy>
    <Window id="detail">
<View id="Container" onTouchend="fooFunction"> </View>
</Window>
</Alloy>

other.xml

<Alloy>
    <Window id="other">
<View id="Container" onTouchend="fooFunction"> </View>
</Window>
</Alloy>

And how to clean object from memory when I close window for prevent memory leak?

Edited for window closing event for prevent memory leak;

    $.detail.addEventListener("close", function() {

        // this listerner creates when window open for paused app event
        Ti.App.removeEventListener("app:RefreshJson", fncRefreshJson);

        $.Container.removeAllChildren();
        $.detail.removeAllChildren();

        $.removeListener();
        $.destroy();

    // listview creates on the fly when new window opens
    // then I am adding it into $.Container
        listView = null; 
        $.detail = null;

    });

Answer 1

From the docs: IDs should be unique per view but are not global, so multiple views can have components with the same ID.

Your approach is fine. A couple of notes

• If the id is omitted from the top level component in the view, then alloy will adopt the file name as the identifier. So if you left off id="home", then in home.js, you would still reference the window object as... $.home since that is the file name.
• camelCasing is the common format to use in Alloy, so View id="container" might be the way to go.
• memory leaks specific to Alloy can occur with Data Binding, so bindings must be properly destroyed. Other than that, the same Memory Management tips should apply. The big one is to not use global event listeners. If needed, you can use Backbone Events instead.

Personally, I've found it easier to use the same identifier for all my windows, such as <Window id="win"> (and $.win in the controller) so when switching around between view controllers, I don't have to look up or remember what the name or file name is for this particular window.

Answer 2

My article on this topic is three-years old. But, in a quick scan I think it all still applies today. http://www.tidev.io/2014/03/27/memory-management/

And how to clean object from memory when I close window for prevent memory leak?

It depends:

If the window is part of a tab group, then it will remain in memory as long as the app is running.

If it's a window that is opened in a navigation group or in a stack of windows on Android, it would depend on how you instantiated the window.

// if you do this:
var win = Alloy.createController('detail').getView();
win.open();

// then to clean up, after
win.close()
// you need to
win = undefined;

// which is why it's better to do this if you can
Alloy.createController('detail').getView().open();

// then, inside of detail, you'd call its Window.close()
// method which would close the window and remove the
// last reference in memory and the object would be GC'd

As an aside, if you are really creating multiple windows with code as similar as you show above, perhaps you should create a Widget. You'd pass in defining characteristics (options, names, child Views, etc.) when instantiating the widget. This technique won't necessarily help with memory management or performance. But, it will help eliminate duplicate code.