[jQuery] google.load speed with jquery
I'm using google jsapi to load jquery. The example shows to do this:
<script type="text/javascript" src="http://www.google.com/jsapi"></
script>
<script type="text/javascript">
google.load("jquery", "1.3.2");
google.setOnLoadCallback(function() {
// Place init code here instead of $(document).ready()
});
</script>
The problem I'm having is this... I'm also including google map api,
google search api and jquery ui. all using .load. I then have
several jquery plugins I'm using along with alot of code in the
document.ready. My thinking was that I include two js files the first
being
http://www.google.com/jsapi
and the 2nd having this:
google.load("jquery", "1.3.2");
google.load("jqueryui", "1.7.2");
google.setOnLoadCallback(function() {
});
so my code would like like this in the index file:
<script type="text/javascript" src="http://www.google.com/jsapi"></
script>
<script type="text/javascript" src="http://myserver.com/js/combined-
load-js-files-and-doc-read.js"></script>
I'm wondering if this is hurting performance on the site by
putting .load in another script file. My reasoning was that to
include 30k+ of js plugins and code in index.php file would be bloat,
so I figured I would put it in a separate file.
Does anyone have any tips on how to do this properly, even if lets say
I just include the google.load in the header and have the
document.ready.... how do I pull in this massive js file?
Secondly... and I think this steams from the performance problem....
but i'm using jquery ui tabs... and they take forever to render,
mostly because I think all of this js is loading. TIA!