There are 4 things you can do.
- Minify your JS File. This removes all comments and Whitespace to reduce its size.
- Combine your JS Files on each page so that there is only 1 file.
- Use a package to gzip your files when you send them. This will make them even smaller
And some other people have suggested:
- Apache will automatically handle compression (and caching of compressed content) which massively simplifies management of files
- Wildcard domains (with multiple URIs) will allow more concurrent connections. Pre-fetching is not just for images/
If you are using common libraries (such as jQuery, Prototype or Dojo), you can offload the file to Google and make them serve it, this gives you several advantages:
- You don't have to worry about minifying and zipping etc
- It's not your bandwidth
- These files come from a different domain, so you can (at least partially) workaround the limit of 2 parallel requests per hostname
- If you're lucky, the user has already visited some other site that used the same library from the same provider, so they already have it in the browser cache.
Note: The version you ask for can have a large impact on the caching characteristics: asking for jQuery 1.4.2 will give you a file that can be cached for a year, but 1.4 can only be cached for an hour.
You can put the whole library into one js file and compress the file. However, it really only matters for the first loading of a page. After this your js file will be cached in the browser, in particular if you set the cache-expiration long enough. Hence any consecutive hit will not load your js file anymore.
In addition to the answers above, you can use the Google Closure Compiler to automatically compress and optimize your JS while integrating with other 3rd party libraries (jQuery, YUI, mootools, etc.)
If you have a number of page elements & access to separate domain, you can consider hosting all static files including the large JS file on the second domain.
...in some situations, it’s worthwhile to take a bunch of resources that are being downloaded on a single domain and split them across multiple domains. I call this domain sharding. Doing this allows more resources to be downloaded in parallel, reducing the overall page load time.
elsewhere he writes..
Browsers open a limited number of connections per domain...Splitting, or sharding, the requests across two domains, as opposed to one domain, results in a faster page, especially in IE 6 & 7