Years ago I've learned that <script> in <head> will block page rendering, reducing website's perceived load time, instead they should be included in the end of the <body>.
I guess this doesn't apply for a webapp, which doesn't work without JavaScript anyway. In fact, it should be even desirable to load them first because of templates compilation. However, in all tutorials on Ember and Angular I see the scripts included at the end. Is it still reasonable?
With regards to angular, most of the time it makes very little difference where you put them. In most web app angular situations, you will have an incredibly small starting page. Most of your actual functionality will be inject later via view or ui-view (if you're using angular ui).
Angular also includes a directive called ng-cloak that will hide your app until the templates have compiled and rendered. This is a nice way to hide the template syntax from the end user until it's ready.
On the topic of placing scripts, the official documentation on Angular says:
Place the script tag at the bottom of the page. Placing script tags at the end of the page improves app load time because the HTML loading is not blocked by loading of the angular.js script. http://docs.angularjs.org/guide/bootstrap
In practice, unless you have a lot of other scripts (jQuery widgets, plugins, etc) that execute immediately, you won't see a performance difference in small apps. If you get to an application with a large enough set of controllers, it won't hurt to place them at the bottom. At that point though, you should really consider a much more proven technique: reduce http requests.
That's a whole other can of worms, but an automated task runner like Grunt could handle minifying and combining your different controller scripts.
There are merits for loading scripts in <head>. $.ajax, for example, can begin making requests much before the DOM is ready. So, if your webapp relies on external data (e.g. configuration JSON), having the $.getJSON() part of your app in head will decrease perceived load time.
Of course, like you said, head scripts are blocking. It is largely case-by-case where your scripts ought to be.
Adding to Mike's answer
Inclusion of script should be done in the following manner:
Reasons for doing it this way:
When your web-app will load, the initial mechanisms will start making connections and by the time your page data is loaded, they will have the background connectivity in place for you to start the functionality.
Using DOM manipulation and data stores at the end helps in minimizing the CPU and memory usage by providing the access of data to function on their request, which might be not possible if the function has been invoked early of the DOM elements presence on the page.
Using ng-cloak makes sure that your DOM elements are prevented from view before complete rendering. So you can do your manipulation without worrying about any embarrassment during page load.
I'll expand this a bit. As I said in the comments scripts block regardless of where you place them unless you place the async attribute on them. You could place them at the beginning or the end and either would be fine. To my knowledge the reason to place them at the end is because asyncronous fetch operations like loading images are started as soon as possible. It doesn't hurt to place them at the end. Just be sure your library scripts are placed before the scripts you use them in.
"Including all js at bottom of page instead of head" is an old concept. It does not affect today.
Modern browsers are intelligent enough to decide what things can be downloaded parallel. scripts inside head does not always block the page rendering in case of modern browsers
Bandwidth in old days was very low. But today we have bandwidth in MBPS. Also average size of our scripts are around 100 to 200 KB max. It won't take even a second to load this JS
conclusion : Do not worry about this concept of having your scripts not in head tag :)
Google PageSpeed checker (http://developers.google.com/speed/pagespeed/insights/) wants the scripts to be placed at the end. And this is more costly when you also target mobile devices. So even if page require js to work its better to load it at bottom. The static page is loaded first and gives user idea of content. And after that you make it alive with your scripts.