Why Is The Standard To Put The Css And Js File At The Top And Bottom Of The Page (respectively)?
Solution 1:
That's not entirely correct. Said simply:
Style declarations should be as close to the top as possible, since browsers won't render your page before loading the CSS (to avoid a flash of unstyled content)
Script tags should be as close to the bottom as possible, since they block browsers from parsing after the tag before it is loaded and complete (because the script may change the document with document.write)
If you're interested in frontend performance, I highly recommend reading High Performance Web Sites: Essential Knowledge for Front-End Engineers by Steve Souders.
Solution 2:
There are plenty of WHY's out there, but I always go with the one From Yahoo Developers
Rule 5 for High Performance Websites - Put Stylesheets at the Top
and
Rule 6 for High Performance Websites – Move Scripts to the Bottom
Solution 3:
It's not standard to put js-files in the header, most of the time it's even better to put them at the bottom of a page, because then the js loads after the html is loaded. That enables the direct use of html elements (e.g. adding handlers to certain divs etc.). For css, especially the <link> tag, it's standard to use it in the header. This makes styling available for the html that is loaded in the <body>. The place of either css/js has little to do with performance.
Solution 4:
The reason to put CSS in the top is to load it before rendering the page, so the page is rendered with it's styles. Otherwise it will be rendered without the design, and later re-rendered. The JS often is loaded at the bottom, not at the top. The reason to load some JS in the header is to have it available in the page (otherwise you may call undefined object/function, if you have JS in the page body, that uses external libraries)
Solution 5:
CSS should be at the top, so the browser can start layouting immediately.
Javascript should be at the bottom. Javascript can contain document.write(), so the browser can not render anything after Javascript before it has run the Javascript.
Post a Comment for "Why Is The Standard To Put The Css And Js File At The Top And Bottom Of The Page (respectively)?"