Question

I have about 40 lines of code that’s currently wrapped in doc.ready in the head of my page. It’s all UI related stuff that will be used on every page of the website. Stuff like: scroll back to top button, fixed header background goes darker once scroll past certain height, .load to load html into a div container, etc…

Since the js will be used on every page of the website, what’s the best practice? Should I leave it as is and just move it to the footer of my page?

Or should I still create a default.js file that loads it in? Fairly new at this so any help is appreciated. thanks

Answer 1

If you’re using the same script on multiple pages, then yes, it probably makes sense to put it in a separate .js file and reference it from each page (I do that anyway, even if only using the JavaScript on one page). And yes, if you control where the <script> tags are, there’s rarely any reason to use ready, just put the <script> tags at the bottom, just before the closing </body> tag. References for that last:

• Google on when DOM elements are available
• YUI Best Practices for Speeding Up Your Website