Question

I upgraded from 0.5.3 to 0.9.2 of backbone.js and I noticed a significant decrease in speed on my application. The application handles many large collections and adds a large number of models at certain points. There is anywhere between 0 to 600 models added at a time. In the 0.5.3 version the sortedIndex function was the most used taking 12% of the CPU. in the 0.9.2 version the code became significantly slower and the sortBy function was taking 70% of the CPU.

I suspect that they are adding all the models then sorting it rather than adding each model to where it should be to keep the collection sorted. Is there a flag I can use to make it use the old method or any other way of speeding it up. I realise that I could implement my own collection class specific for my large data sets but I would prefer to stick with backbone collections right now.

Here is the collection comparator

comparator: function(model) {
    return model.get("timestamp");
}

Thanks in advance

Answer 1

You could try using a two-argument comparator:

Comparator function can be defined as either a sortBy (pass a function that takes a single argument), or as a sort (pass a comparator function that expects two arguments).

so that you could use the native sort rather than Underscore’s sortBy; sortBy has a bit of overhead from the _.pluck and _.map calls and from building the objects for the Schwartzian Transform; a Schwartzian Transform really only makes sense when computing the sort keys is expensive, m.get(a) is not expensive and m.attributes[a] (which is all get does anyway) is cheaper still.

So an easy first attempt would be:

comparator: function(a, b) {
    if(a.attributes.timestamp < b.attributes.timestamp)
        return -1;
    else if(a.attributes.timestamp > b.attributes.timestamp)
        return 1;
    return 0;
}

The Collection#add method does sort the collection on each insertion:

for (i = 0, length = models.length; i < length; i++) {
  //...
  if (this.comparator && options.at == null) this.sort({silent: true});
  //...
}

unless you tell it where to put the models using the at option; the "add" event includes the index of the newly added element so the collection needs to sort on each insertion so that the event has the right values. But, if you can pre-sort the models before calling add and find the correct insertion point manually, then you can skip the sort calls inside add. You might have to add your models one-by-one of course but that shouldn’t be difficult: just walk through both the new (pre-sorted) models and the existing collection concurrently to figure out the correct insertion point for each model.