Is placing scripts at the bottom of the the same as onDomReady?

Question

Possible Duplicate:
$(document).ready(function(){}); vs script at the bottom of page

Ever since I read this book, I've written my pages like this:

<!DOCTYPE html>
<html>
    <head>
        <!-- styles -->
    </head>
    <body>
        <!-- page content -->
        <!-- scripts -->
    </body>
</html>

Is this, relatively speaking, like running all of my code in a jQuery $(document).ready(function() {});? I haven't really noticed any difference in things being ready or not, things just work and I don't have to wrap things in a function to get things going.

check this one. It's pretty close to what you ask. http://stackoverflow.com/questions/6026645/document-readyfunction-vs-script-at-the-bottom-of-page — Savas Vedova, Dec 02 '11 at 22:16

score 1 · Answer 1 · answered Dec 02 '11 at 22:19

A browser will stop rendering html when it comes across a script - since it has to stop and parse the script file, top down - which can leave your window blank for long periods of time. Most web developers would rather give their users the ability to start viewing the contents of a page (even though all script functionality might not yet be in place) instead of making them stare at a blank white page. This is the main reason for deferred loading of script files by placing their tags at the bottom of the body tag.

score 1 · Accepted Answer · answered Dec 02 '11 at 22:20

No, it's not exactly the same. It's pretty close however.

The big issue in my experience is handling intra-page <script> blocks that assume some preparatory work is already done. Loading up a JavaScript framework is (again, my personal experience) one of the big issues.

Other than that, loading at the end of the <body> is a great idea. The "DOM ready" state is a little tenuous in older versions of IE anyway. (Frameworks can cope, but it's still a minor mess.)

score 0 · Answer 3 · answered Dec 02 '11 at 22:19

In terms of when the scripts fire - yes, it's the same. However the difference arises during the load - when you place your JS files at the top they will block all other assets from being loaded until the JS are completed. But this is not always the case as well - you can use head.js as a workaround for example

Is placing scripts at the bottom of the the same as onDomReady?

3 Answers3