Speeding Up Our Site: jQuery and jQuery UI from a CDN
I'm a big fan of sites that work really, really fast. Mostly because I know that a fast website equals happy customers and happy customers equal increased revenue. One of the things that High Performance Web Sites suggests is reducing the total number of requests a site make so the user's browser spends less time communicating with your server and more time having your users interact with your site. A quick way to do this is to offload jQuery to a CDN like Google so everyone can use the same jQuery file (I mean exactly).
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
The only downside to this is if Google happens to be down (which doesn't happen frequently) or your development computer isn't online (also not very frequent but still an issue) then your site is going to grind to a halt. In order to prevent that we can add fallbacks to check and see if jQuery has been loaded and if it hasn't we'll load the copy from our server.
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="/js-static/jquery-1.10.2.min.js"></script>')</script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<script>window.jQuery.ui || document.write('<script src="/js-static/jqueryui-1.10.3.min.js"></script>')</script>
I've started adding this to every site I build now and it's great.
Scott Keck-Warren
Scott is the Director of Technology at WeCare Connect where he strives to provide solutions for his customers needs. He's the father of two and can be found most weekends working on projects around the house with his loving partner.
Top Posts
- Working With Soft Deletes in Laravel (By Example)
- Fixing CMake was unable to find a build program corresponding to "Unix Makefiles"
- Upgrading to Laravel 8.x
- Get The Count of the Number of Users in an AD Group
- Multiple Vagrant VMs in One Vagrantfile
- Fixing the "this is larger than GitHub's recommended maximum file size of 50.00 MB" error
- Changing the Directory Vagrant Stores the VMs In
- Accepting Android SDK Licenses From The OSX Command Line
- Fixing the 'Target class [config] does not exist' Error
- Using Rectangle to Manage MacOS Windows