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.

closed #6

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