What's the best method to reduce the number of external JavaScript calls (HTTP Request)?

Question

Currently I'm having the following external javascript in my header:

 <script type="text/javascript" src="scripts/jquery-1.3.2.min.js"></script>
 <script type="text/javascript" src="scripts/jquery.validate.js"></script>
 <script type="text/javascript" src="fancybox/jquery.fancybox-1.3.1.pack.js"></script>
 <script type="text/javascript" src="scripts/jquery.scrollTo-min.js"></script>
 <script type="text/javascript" src="scripts/jquery.localscroll-min.js"></script>
 <script type="text/javascript" src="scripts/custom.js"></script>
 <?php if($lang_file=='lang.en.php') {echo '<script type="text/javascript" src="scripts/jquery-validate/val-en.js"></script>';} ?>

Google's Page-Speed recommended me to reduce the number of external JS calls. But I'm not very sure what's the best method of doing this.

Any suggestions?

Answer 1

When you go to production, combine all the scripts into a single script that contains each in the order that you want them loaded. Then include only this combined script in your page. Or, if page load seems fast enough, don't worry it -- until the number and size of the scripts starts causing you problems.