Welcoming Screen instead of Blank Screen


Hi guys!

Sorry if this sounds silly or wastes your time. I am medical student from Cambodia with little background in programming. I am writing an Ember app to digitalize patient records in Cambodia, however the white screen while Ember app is loading is not a good user experience to attract my practicians to use technology in their daily practices.

I put a div#splashscreen styled with css to mimic the splash screen in the body tag of index.html and then I used didRender or didInsertElement hooks to remove that div#splashscreen or just change the display to none. It kind of solves my problem, but I do not see anyone doing this. I guess there might be something wrong with this approach because even Ember Observer leaves the white blank screen as it is.

Once again, I am really a noobie in Ember as well as programming in general. Sorry if there is anything wrong.

May anyone help me out with this?


This is an established pattern and there is also an addon to help with it: https://www.npmjs.com/package/ember-load


Yes, that’s exactly what I want. Thank you so much, @jasonmit.


ember-load relies on views + so if your on Ember 2+ you’ll also need ember-legacy-views addon.


I wrapped the app in a component so that I can use didRender hook to remove the splash screen. Is it better than using the addon?


Good open source opportunity to move it forward.


Just spent a while playing with that add-on to move it forward as you put it - but seems like Mike has already removed that dependency / and it just wasn’t noted. : )