Я создаю слишком много объектов в маршрутах backbone.js?

Я замечаю, что мое приложение начинает тормозить, когда я слишком много раз меняю URL-адреса. Я подозреваю, что это связано с тем, что у меня настроены маршруты таким образом, что они создают новое представление каждый раз при посещении URL-адреса, не уверен, что есть другой способ сделать это. Возможно, я недостаточно понимаю javascript. Что происходит с представлениями, которые я создал после того, как они больше не используются, или, другими словами, когда я посещаю новый маршрут?

var Router = Backbone.Router.extend({
    routes: {
        '':'doSomething',
        'helloworld':'doSomethingElse'
    }
});

var app_router = new Router;

app_router.on('route:doSomething', function() {
    var thing = new SomeModel();
    new someView({model : thing});
});

app_router.on('route:doSomethingElse', function() {
    var thing = new SomeModel();
    new someOtherView({model : thing});
});

поэтому в этом простом примере, если бы я щелкнул назад и четвертым по ссылкам <a href="#"> и <a href="#helloworld">, было бы просто построение объектов представления и модели? и если да, то это будет проблемой. Я бы предположил, что память будет съедена, но я могу просто не понимать вещи правильно.

Вот скриншот временной шкалы, когда я щелкаю назад и четвертым между двумя маршрутами. Кажется, что существует множество слушателей, которые, как я предполагаю, исходят от прослушивателей событий, которые я установил для одного из конкретных представлений. Я думаю, что это создает новых слушателей при каждом экземпляре.

введите здесь описание изображения


javascript router instantiation backbone.js
person Spencer Cooley    schedule 26.08.2014    source источник
comment
У тебя утечка памяти? Вы проверили инструменты разработчика вашего браузера?   -  person mu is too short    schedule 27.08.2014

Ответы (1)


arrow_upward
4
arrow_downward

Я думаю, что вы производите просмотры "зомби". Это происходит, когда вы создаете представление, например:

new someOtherView({model : thing});

который, вероятно, содержит привязки событий к элементам DOM. В следующий раз, когда вы снова отправитесь по тому же маршруту, вы просто создадите другое представление с новыми привязками и без отмены привязки событий предыдущего представления.

Дерик Бейли написал об этом отличную статью:

http://lostechies.com/derickbailey/2011/09/15/zombies-run-managing-page-transitions-in-backbone-apps/

чтобы упростить, вы должны реализовать механизм закрытия в своих представлениях и закрывать их (отвязывать зарегистрированные события) перед созданием нового.

Мои представления Backbone обычно имеют метод close:

close: function () {
    this.model.stopListening();
    // unbind other stuff
}

в то время как мои маршрутизаторы всегда содержат ссылки на ранее созданные представления:

app_router.on('route:doSomething', function(id) {
    var thing = new SomeModel();
    if (this.currentSomeView) {
        this.currentSomeView.close(); // this will unbind the previously registered events
    }
    this.currentSomeView = new someView({model : thing});
 });
person Akos K    schedule 26.08.2014
comment
Разве магистраль не предоставляет способ выгрузить представление? Как Ext-JS метод уничтожения компонента делает? Думаю, нет, см. stackoverflow.com/a/11534056/227299. - person Juan Mendes; 27.08.2014
comment
Похоже, это, вероятно, проблема, потому что у меня есть несколько привязок событий к элементам DOM в одном из представлений. - person Spencer Cooley; 27.08.2014
comment
Я расширил свой ответ примером из моего собственного кода. - person Akos K; 27.08.2014
comment
да, если вы не реализуете свой собственный метод close, как это сделал я. Смотрите мой ответ. - person Akos K; 27.08.2014
comment
как я уже сказал, это был пример из моего кода, я никогда не удаляю элементы DOM со своей страницы, а просто перерисовываю их, поэтому я никогда не вызываю remove(). Я просто дал ему представление, в каком направлении ему двигаться. - person Akos K; 27.08.2014