• me

    like!!!

  • opensas

    It would be great if you could include the code of the destroy method. There’s a lot of disussion about the best way to remove a view. This is a very good article: http://lostechies.com/derickbailey/2011/09/15/zombies-run-managing-page-transitions-in-backbone-apps/, and a related question on stack overflow: http://stackoverflow.com/questions/6569704/destroy-or-remove-a-view-in-backbone-js

  • Me

    “Why to use”??

  • http://www.orizens.com/ Oren Farchi

    Hi opensas.
    There are quite good examples on the both links you shared.However, If one is working correctly with a distinct separation between Models and View or DOM and JS data, then a ‘destroy’ method of a View should:- unbind event listeners on this.$el
    – remove DOM element from DOM (build in as ‘remove’ method by jquery)
    – run ‘destroy’ for sub views :-)- remove references of sub views – in this post – ‘this.views’ should be referenced to null. You can also use js ‘delete’ to explicitly free js memory for views.As a rule of thumb, you should clean any references to objects in side your View object plus the reference to the view itself – which will apparently be somewhere in your code.

  • opensas

    I’d like something fairly simple and bullet proof… do you think something like this might work??? (haven’t tried it)

    http://jsfiddle.net/opensas/DcZdq/

    saludos

    sas

  • http://www.orizens.com/ Oren Farchi

    Hi Sas.
    Change this line:
    this.views = [];
    to a property of the object:
    views: [];
    Otherwise – that code should work as expected.

  • opensas

    silly mistake, thanks
    this is the corrected version: http://jsfiddle.net/opensas/DcZdq/5/

  • Pingback:

  • roblevintennis

    Yeah figuring out a good mechanism for view disposal is challenging. We founds that an additional trouble spot is not inadvertently staying around if attached to jQuery plugins custom events, etc. It seems that boiler plate unwinding should be done by a super or mixin, but also optionally overridden by each view itself to ensure these custom events are completely unbound.

  • http://www.orizens.com/ Oren Farhi

    jquery plugins should be considered as 3rd party that should be handled separately in the destroy process.

    My advice is using a “destroy” event (or “before:destroy”) so you can listen to and unbind any 3rd party attachments.

    Thanks.

  • johndurbinn

    Sammy Farha!

  • johndurbinn

    Backbone == LOTS of BOILERPLATES!!!

  • UncleBob

    Two things; first, you could use map() to create your views list:

    this.views = this.collection.map(function(item) {
    return new CommentView({ model: item });
    });

    Also, for performance purpose it may be wise to update DOM rendering only once, still using map():

    this.$el.html(this.views.map(function(view) {
    return view.render().$el;
    }));

    (untested code, but you get the picture)

  • http://www.orizens.com/ Oren Farhi

    hi.
    You’re right – “map” for creating and appending views is much more cleaner method for creating views (updated the code).
    Thanks :)

  • miphe

    Very interesting, thanks for the example. As a bare boilerplate looks good, I would prefer to use Marionette and perhaps by BossviewBossview for bigger projects.

  • http://www.orizens.com/ Oren Farhi

    hi miphe.

    thanks for your comment.

    i integrated the idea of dealing with views to 2 plugins:

    backbone collection view – https://github.com/orizens/backbone.collection-view

    backbone switcher – https://github.com/orizens/backbone-switcher