ember component memory leak

I'm experiencing a very serious memory leak in a large Ember-CLI application. I can easily replicate bringing the application to a point where it slows then crashes completely.

After a lot of time spent looking at performance bottlenecks etc. (which has resulted in improvements), I've determined that I have a memory leak.

In the usual spirit of things I've tried to make as simple a sample piece of code as possible. My conclusion : That Ember Components leak memory when conditionally included.

However, I can't see anyone else complaining, so wondering if I have overlooked something obvious?

My test applications produce the exact same output, but in two different ways. In both cases then the application initialises, it created a data array of 1000 simple objects, one attribute of which is vis, which is initially set to false. After an initial delay, those 1000 objects have the vis property changed to true at 50ms intervals.

export default Ember.Controller.extend({

    data : [],
    scrollTimer : null,

    init : function()
    {
        var data = this.get("data");

        for (var x=0;x<500;x++)
        {
            var obj = {id:x,label:"o".repeat(10) + "_" + x,vis:false};

            data.push(obj);

            obj = null;
        }

        Ember.run.later(this,this.make_visible,0,5000);
    },

    make_visible : function(idx)
    {
        var data = this.get("data");

        Ember.set(data[idx++],"vis",true);

        if (idx < data.length)
        {
            Ember.run.later(this,this.make_visible,idx,10);
        }
    },
});

In TEST 1, My application template looks like this:

{{#each data as |item index|}}

    {{data-item item=item}} 

{{/each}}

and data-item looks like this:

template:

{{component itemComponent item=item}}

js:

export default Ember.Component.extend({

        itemComponent : function()
        {
            var item = this.get("item");

            return item.vis ? "item-visible" : "item-hidden";

        }.property("item.vis"),

    });

item-visible and item-hidden are just HBS files with static text hidden and visible.

So when it runs, I get 1000 lines saying hidden, which slowly change to say visible. In this case, the logic in data-item swapping which component is outputting the text, initially item-hidden, then item-visible.

Timeline snapshot from Chrome dev tools

Here you can see a continual increase in the memory consumed.

There is a twiddle here : http://ift.tt/1ZXMZ90

In TEST 2, I've dispensed with the item-visible / item-hidden components and data-item now uses inline conditional logic to output the hidden / visible text directly.

{{#if item.vis}}
        <div>visible</div>
{{else}}
        <div>hidden</div>
{{/if}}

Timeline snapshot from Chrome dev tools

This time memory is being released from time to time as I'd expect.

There is a twiddle here : http://ift.tt/1ZXMZ95

So my question is, why is conditionally including a component like this causing this memory leak? What can I do differently to avoid it?

In my actual application I have logic like this:

{{#if XXXXX}}
    {{component-x}}
{{else}}
    {{component-y}}
{{/if}}

This has the same memory leak issues.

I'm using Ember 1.3.8 (With latest Ember-CLI), Twiddle seems to be using 1.3.10