Loading GIF stops animating when loading objects


I think this is a relatively known issue, but a loading icon that’s a GIF will stop animating when either loading objects or rendering, not sure which. Has anyone found a solution to this problem?

I have only found a Stack Overflow post about it, http://stackoverflow.com/questions/10358065/animated-gif-pauses-when-ember-js-objects-are-loading, but it doesn’t provide any answers.

Loading gif hanging on expensive render

I too face the same problem with the css loader… Tried to figure out what is going wrong. Eagerly looking for a solution !!

@seilund Any Idea on this .?


I’m pretty sure that’s a browser limitation, it’s blocking the UI thread while it’s rendering your new view.


Yeah, sounds like the loading is blocking the UI thread. I tend to use the setImmediate -method to circumvent this: defer the object loading to run at a “later” time, so the UI can run and the GIF animate. Something like this (super simplified):

var this = _this;

// Signal that we're loading, so the GIF is displayed
this.set('loading', true);

// Defer the costly data fetching, so the UI thread is not blocked
setTimeout(function() { _this.getThings(); }, 0);

Anyhow… I ended up here, on this thread, because I was looking for an Ember alternative to the setImmediate -method. Anyone happen to know? :smiley:

Edit: To answer my own question, Em.run.next() seems to ~about fit the bill.


Yes, this is a browser limitation. However, if you’re using Ember Data, we’re doing some performance work to make initialization quicker so this should be less of an issue going forwards.


This topic was automatically closed after 7 days. New replies are no longer allowed.