How to use a smaller faster jQuery with Dolphin 7

The latest/current version Dolphin 7.0.9 has been updated to use a smaller minified jQuery version. The jquery.js file in Dolphin 7.0.8, which you can find in /plugins/jquery/jquery.js is around 117 KB's in size and the version being used is 1.3.2.

The Dolphin 7.0.9 file is located in the same location (/plugins/jquery/jquery.js). It is still version 1.3.2, but it is a minified/smaller version. The size is now around 56 KB's or about 1/2 the size of the one used in Dolphin 7.0.8 and earlier.

Basically a smaller jquery.js file means faster loading and less bandwidth usage. Probably not a noticeable difference, but definitely better to have a smaller file than a larger one.

You can take this one step further by serving up the same jquery.js file that is minified and compressed from Google, which is an even smaller file size than the one in Dolphin 7.0.9. If you use the one from Google it is only 19.28 KB's in size. They also have a non-minified version that is still smaller than the one Boonex is using in the current Dolphin version at 34.45 KB's.

Basically you can load either a minified jQuery directly from the very fast Google network at 19.28 Kb's.
Load a non-minified jQuery directly from Google at 34.45 KB's.
Or, use the Dolphin 7.0.9 minified jQuery at 56 KB's.

Previous Dolphin versions 7.0.8 and under have a non-minified jQuery at around 117 KB's.

Even if you have js cache enabled in your Dolphin administration panel it will cache the smaller Google version directly to your dolphin hosting space.

You don't need to be using Dolphin 7.0.9. You can also use the Google jQuery with previous versions of Dolphin as well. I have been using the Google minified jQuery version with Dolphin 7.0.8 for quite a while now without any problems. I have not tested every single area of Dolphin to make sure, but I haven't noticed any problems.

It is very fast and simple to use Google jQuery instead. It only involves editing one Dolphin file and clearing your Dolphin js cache in your administration panel.


Download and back up the following file:
/inc/params.inc.php


Then, open the file and find:

//--- Add default JS ---//
$oSysTemplate->addJs(array(
'jquery.js',
'jquery.jfeed.js',
'jquery.dimensions.js',
'functions.js',
'jquery.dolTopMenu.js',
'jquery.dolRSSFeed.js',
'jquery.float_info.js',
'jquery.webForms.js',
'jquery.form.js',
'jquery.dolPopup.js',
'common_anim.js',
'login.js',
'ie7_flash_fix.js',
'BxDolVoting.js',
'user_status.js',
));

Change and edit the jquery.js line to use Google's.

Google minified jQuery (19.28 KB version):
http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js

Google non-minified jQuery (34.45 KB version):
http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js



So to use the minified version you would change to this:

//--- Add default JS ---//
$oSysTemplate->addJs(array(
'http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js',
'jquery.jfeed.js',
'jquery.dimensions.js',
'functions.js',
'jquery.dolTopMenu.js',
'jquery.dolRSSFeed.js',
'jquery.float_info.js',
'jquery.webForms.js',
'jquery.form.js',
'jquery.dolPopup.js',
'common_anim.js',
'login.js',
'ie7_flash_fix.js',
'BxDolVoting.js',
'user_status.js',
));



To use the standard version you would change to this:

//--- Add default JS ---//
$oSysTemplate->addJs(array(
'http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js',
'jquery.jfeed.js',
'jquery.dimensions.js',
'functions.js',
'jquery.dolTopMenu.js',
'jquery.dolRSSFeed.js',
'jquery.float_info.js',
'jquery.webForms.js',
'jquery.form.js',
'jquery.dolPopup.js',
'common_anim.js',
'login.js',
'ie7_flash_fix.js',
'BxDolVoting.js',
'user_status.js',
));


Save the changes back to your hosting account.

Then, login to your Dolphin 7 Administration and clear the js cache.

Log out of Dolphin Admin and refresh your site a few times. Navigate and test various parts of your site to verify everything is working.


Testing:
You can view your website page source code with your web browser and look for the Google jQuery code in the header part of the code. If you have js cache enabled in your Dolphin 7 administration you will find something like this in the page source:

<script language="javascript" type="text/javascript" src="http://www.dialme.com/gzip_loader.php?file=bx_templ_js_34ee26977d5ed6de21599ca0d1342fe3.js"></script>

Click on or visit that link and you will see the Google reference like:

/*--- BEGIN: http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js---*/





You can also test your site before and after at Pingdom.





Look for the (js) gzip.loader file if you use js cache in your admin panel. The file should be smaller after applying.

If you do not have js cache enabled in your admin panel look for (js) http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js or http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js in the header while viewing the page source. The file should also be smaller after applying if testing at Pingdom.

Plus / Minus:
The plus side is you are using the Google network to serve up a smaller jQuery file. The file is smaller than the one included in Dolphin and Google is fast. The chances that a visitor has it cached in their web browser before visiting your site are also greater. It is easy to add the code.

The minus side or drawback is if or when Boonex releases a new version that includes /inc/params.inc.php you will have to reapply this. Otherwise, you will fall back to using the larger Boonex Dolphin jquery.js file after an upgrade. Not a big deal nor is it time-consuming, but you will have to take note and remember this if you want to continue using it after a Dolphin upgrade/update.