A script has no actual use until the HTML has finished loading - a script can’t change the DOM until the HTML has loaded.
document.ready waits for the DOM to load. So, there's no point it holding up important things like stylesheets.
Put the scripts at the bottom of the page (before the
</body> tag) to order to get your HTML and CSS to the user as quick as you can. The browser will be able to render the page much quicker and then scripts can be loaded, rather than leaving a blank page for the user to stare at whilst they wait for scripts to download.
Note: The opposite is true for Stylesheets - Stylesheets near the bottom of the page block progressive rendering until all stylesheets have been downloaded and moving them to the document
HEAD eliminates the problem.
<script/> element using the DOM
createElement() method and add it to the page just before the closing
var oScript = document.createElement("script");
oScript.src = "/path/to/my.js";
The browser doesn't start downloading the js script until the new