Ember: Avoid UI flickering when content changes

Question

I have a ArrayController which has some content (say array of 10 objects) and a View which is rendering the list of all ArrayController elements.

Now when the content changes the view is emptied and then reconstructed. This causes UI Flickering. This flickering is irritating to eyes.

So any suggestions on how to fix this type of issues or minimize the side-affects?

Answer 1

I found that if in the templates I do something like

{{#each controller.content}}
  {{contentAttribute}}
{{/each}}

then I get a flicker. But if I just use the ArrayController itself in my templates I don't get the flicker:

{{#each controller}}
  {{contentAttribute}}
{{/each}}