Accidental memory leaks

Innocent Knockout app illustrates how easy a memory leak can be archived. Of course, a workaround exists (combination of disposeWhen & getSubscriptionsCount) but you should have known about the memory leak to start searching it, but this app doesn't look suspicious to start worry.

Details Knockout Reactive Coffee Warp9

This innocent app demonstrates the work with observable list. You can see sources of the app in the right column. They look fine, but the app has a memory leak: click several times on 'add' button, then on 'clear' button and repeat the process. You'll see that the number of subscriptions only increases, so we obviously have a memory leak.

Number of subscriptions to 'this.driver':

HTML

JS

var model = new ViewModel();
ko.applyBindings(model);

function ViewModel() {
    this.adds = 0;
    this.handlers = ko.observable(0);
    this.driver = ko.observable(0);
    this.items = ko.observableArray([]);

    this.add = function() {
        var offset = this.adds++;
        var nova = ko.computed(function(){
            return this.driver() + offset;
        }, this);
        this.items.push({value: nova});
        this.handlers(this.driver.getSubscriptionsCount());
    };

    this.inc = function() {
        this.driver(this.driver()+1);
        this.handlers(this.driver.getSubscriptionsCount());
    };

    this.clear = function() {
        this.items.removeAll();
        this.handlers(this.driver.getSubscriptionsCount());
    };
}