Ember.computed.filter performance

In my ember app, I have a list of users that can be filtered and sorted. To achieve filtering and sorting, I use computed properties Ember.computed.filter

and Ember.computed.sort

, which are built on top of each other, for example (short for brevity):

Ember.ArrayController.extend({
    sortField: 'nickname',
    sortDir: 'asc',
    sortedUsers: Ember.computed.sort('filteredUsers', 'usersSorting'),

    usersSorting: Ember.computed('sortField', 'sortDir', function() {
        return [this.get('sortField') + ':' + this.get('sortDir')];
    },

    filteredUsers: Ember.computed.filter('model', function() {
        //[...matching logic here that uses filNickname, filAgeMin, ect...]
        return matchesFilters;
    }).property('model', 'filNickname', 'filAgeMin', 'filAgeMax' 'filGender')

})

      

My question is that when using properties like this, the values Ember.computed.filter

and are subtracted Ember.computed.sort

, which should return a new array every time they are repeated, and therefore cause my entire list {{each sortedUsers}}

to be re-rendered, or should I only remove / add / change array elements in the same array so that only individual list items are changed in the DOM?

The reason I'm asking is because in my initial testing it seems like the entire list is definitely redrawn every time and wondered if this is possible due to the way I am implementing these properties. While I don't know much on the matter, looking at the internals Ember.computed.filter/sort

it looks like they are using arrayComputed

which I thought I shouldn't have to create a new array every time.

Next question: This list is also likely to contain a relatively large number of users at some point, easily in the hundreds. Similar to how it works (I'm guessing) Ember.computed.filter

is there a way to limit the number of items displayed, create an infinite list of types with a page type, or "Click to load more" without resorting to using something like Array.slice

that would again create a new array and re-displaying the entire list?

+3


source to share





All Articles