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";