Combining array's individual objects without total reload


I have an array i receive from ember data of a single model. When it is consumed by a component i need to combine it with another array and then use the output in a foreach in the template. For example i receive a an object from ember data and i need to combine it with a UI config from local storage and output a single hash[] of the two objects.

I tried using a computed property to do the merging and combining but the template ends up re-rendering the whole array each time instead of just adding an item to the end. I need to avoid re-rendering the entire array if i can help it. What is the proper way to do this?

Should i create another array property and then observe my ember data list and then merge the changes into that array?

For instance:

locationConfigs: []

updateLocationsWithConfigs: function(){   // check to see whats new or been removed from locations and update the locationConfigs array }.observes('locations.length'),

Or should i use an ArrayProxy, or some Ember.computed’ism?