Via Smashing Magazine:

Putting scripts at the bottom of the page is an outdated technique. Use async and defer instead. 

Here is example.

HTML:

<!DOCTYPE html>
<html>

	<head>
		<script src="/defer.js" defer></script>
		<script src="/async.js" async></script>
	</head>
	
	<body>
		<div id="defer">
			If everything is ok, you will not see me
		</div>
		
		<div id="async">
			If everything is ok, you will not see me
		</div>		
	</body>

</html>

Note lines:
<script src="/defer.js" defer></script>
and
<script src="/async.js" async></script>

JS part is simple, just an example, defer.js:

document.querySelector("#defer").innerText = "defer";

async.js:

document.querySelector("#async").innerText = "async";