Skip to content

A computed property macro for ember.js that returns a reversed array without allocating a new array on each replace action

Notifications You must be signed in to change notification settings

gpoitch/ember-computed-reverse

Repository files navigation

Ember.computed.reverse Build Status

A computed property macro for ember.js that returns a reversed array without allocating a new array on each replace action.

Usage

Include ember-computed-reverse.js after ember.js in your app.

Or using package managers:

npm install ember-computed-reverse
bower install ember-computed-reverse

Examples

App.Timeline = Ember.Object.extend({
  reverseChronPosts: Ember.computed.reverse('posts')
});

var timeline = App.Timeline.create({posts: [
  'good morning',
  'grabbing lunch',
  'making dinner'
]});
timeline.get('reverseChronPosts'); // ['making dinner', 'grabbing lunch', 'good morning']

Why?

Simply using a computed property with toArray().reverse() will recreate a new array every time an item is added/removed from the array. With a large array of items, or complex DOM representation of these items, re-rendering becomes expensive. This leverages reduce computed arrays to perform replace actions one at a time.

Demo

You can see the benefits in this demo

About

A computed property macro for ember.js that returns a reversed array without allocating a new array on each replace action

Resources

Stars

Watchers

Forks

Packages