Animated gif pauses when loading ember.js objects

Question

Having a problem with the spinner actually spinning while ember.js does this. I have a very general jsfiddle example that illustrates the problem:

http://jsfiddle.net/h4ZcZ/2/

I suppose there should be an easy way to make this work expected, but I can't find it. I tried using the JavaScript / CSS spinner implementation (spin.js) with the same results. I saw some things indicating that this is usually a problem with IE, but here it is not. This happens in all browsers on Windows, and I also tested Mac Safari.

Answer 1

The problem is your loop - you are basically blocking the thread. I would use timeouts and break the work that needs to be done so that other processing options on the page can be executed.

Answer 2

As for the root cause, @ChristopherSwasey is correct. I asked several other Ember developers about this. There is no solution, but two interesting thoughts that may help:

1) One developer reported that he encountered this problem and circumvented it, making sure that the animated gif started before the javascript took a long time to execute.

2) Another developer suggested that using a virtualized list is the right way, so that only visible nodes are displayed. However, I am afraid that I do not yet know the open source class Ember virtualized list.

Hope this helps.