The Orca
The Orca

Reputation: 1250

Adding a list of views in backbone correctly

Currently when I insert a list of views in backbone I do :

    var jqGuestList = $("#guestList");
    jqGuestList.empty();

    items.each(function(item){
        var view = new wedapp.view.GuestItem({
            model: item,
            collection: this.collection
        });

        jqGuestList.append(view.render().el);
    });

This however cause my a great deal of pain, adding each one manually to the DOM is slow as hell, specially on mobile but even on desktop..

is there a way to insert all the views in one jqGuestList.html(views) instead?

Upvotes: 2

Views: 1058

Answers (1)

nikoshr
nikoshr

Reputation: 33344

You could use a Document Fragment http://ejohn.org/blog/dom-documentfragments/

var jqGuestList = $("#guestList");
jqGuestList.empty();

var frag = document.createDocumentFragment();
items.each( function(item) {
    var view=new wedapp.view.GuestItem({model:item});
    frag.appendChild(view.render().el);
});

jqGuestList.append(frag);

You should see some improvement.

Upvotes: 5

Related Questions