How to Save Bandwidth and Decrease Load Time on your Website

By Bryan McCaffrey

Website Development

Isn’t that really what all end user-conscious web developers strive for? If not, it should be – it saves time, saves money, AND makes your users happier. And we all know there aren’t a lot of things that can do all three of those at the same time.

So how do we accomplish this ever-elusive feat? With JavaScript, of course.

Now, even though I like to use jQuery for everything, this is not the case this time. In this case, I took a hint from Google’s analytics code. You know that code that you as a webmaster are supposed to have in your document before the closing </head>, yeah that’s what I mean. It is useful for tracking your site traffic AND serving as a great example of dynamic js source loading.

Namely, Google Analytics implements dynamic loading of the tracking script so it will load secure or non-secure, (https or non-https), depending on the state of the current browser window. One of the side benefits of this is that the browser only loads in the tracker file if the user has JavaScript enabled.

So, with this knowledge, we can use it on our own sites and js scripts and load them in only if a user has JavaScript enabled in their browser. Just replace the /path/to/your/file.js with the actual path to your js file.

<script type="text/javascript">
document.write(unescape("%3Cscript src='/path/to/your/javascript/file.js' type='text/javascript'%3E%3C/script%3E"));
</script>

And that’s it.