I am using the Alloy framework in Appcelerator and have been struggling with memory leaks while testing my app with Apple Instruments.
I have a scrollable view, views that are the views or "pages" of that scrollable view and views like thumbnails that are the children of the "page" views. All of these views are being created dynamically and then removed and recreated when a user performs a search which reloads the contents of the scrollable view.
My issue is that even though I am removing the scrollable view and setting it to null the live bytes in Instruments continues to grow every time a search is performed and a new scrollable view is created. How should I be handling these UI elements in order for garbage collection to remove them?
var videoSlider;
function loadData(searchTerms,channel,sortBy,limit) {
if (videoSlider) {
$.scrollableViewHolder.remove(videoSlider);
videoSlider = null;
}
videoSlider = Alloy.createController('videoSlider', {}).getView();
$.scrollableViewHolder.add(videoSlider);
var viewSliderArray = [];
feeds.GetFeeds({
success: function(data) {
Ti.API.info("Number of videos returned from Brightcove " + videosObject.items.length);
var j = 0;
for(var i=0; i<videosObject.items.length; i++) {
if(i % 8 == 0) {
Ti.API.info(i);
if(i > 0) {
viewSliderArray.push(viewSlider);
}
viewSlider = Alloy.createController('viewSlider', {}).getView();
j = 0;
}
tempTime = videosObject.items[i].length/1000;
minutes = Math.round(tempTime/60);
seconds = Math.round(tempTime%60);
seconds = "0"+seconds;
seconds = seconds.substr(seconds.length-2);
videoLength = minutes+":"+seconds;
videoBox = Alloy.createController('videoBox', {
videoBoxTop: videoBoxTop[j],
videoBoxLeft: videoBoxLeft[j],
videoStill : videosObject.items[i].videoStillURL,
videoTitle: videosObject.items[i].name,
videoLength: videoLength
}).getView();
viewSlider.add(videoBox);
j++;
}
viewSliderArray.push(viewSlider);
Ti.API.info(viewSliderArray);
videoSlider.views = viewSliderArray;
}
},searchTerms,channel,sortBy,limit);
}