Exploring Joomla!: Some Tips and Tricks

It is very common to have issues like browser does not serves the latest javascript or stylesheet content, it serves the content from its cache which obviously does not contains the recent changes. The first solution which comes in our mind is to clean the browser cache and all sorted... right?. But you can not apply the same solution at your users’ end.

A very common trick that we usually adopt is to append a revision number or some random number/string/timestamp to the file which leads to the solution.

Example :

<script language="JavaScript" src="/js/myscript.js?n=1"></script>

This method force your browser to load a new copy of the JS file.

You might be wondering how this is related to Joomla or what Joomla has to do with it, well Joomla also provides a similar way to load your scripts and styles.

What Joomla actually do here is, when you load any script (using JHtml class),  Joomla checks whether any file with name MD5SUM exists or not in the same directory in which script file exists.

If MD5SUM file is available then Joomla reads the content of that file and append it to the file.

Suppose your script file is available at

In the absence of MD5SUM,

JHtml::script('com_finder/script.js');

<script src="/media/com_finder/js/script.js" type="text/javascript"></script>

With MD5SUM file

JHtml::script('com_finder/script.js');

<script src="/media/com_paymart/js/paymart.js?6e38cff89c35e60d5e0618acc6dafb74" type="text/javascript"></script>

 The random number appears in src is actually the content of MD5SUM file.

 You can either maintain this MD5SUM file manually or automatically update the file content whenever there is any change in js directory.

 Same concept goes with stylesheet loading. 

Now moving onto the next benefit.

Most of the time we load minified script and stylesheet for maintaining the performance of the site.

But this makes impossible to debug js or css issue unless we load the uncompressed version of that file and for this you need to alter the code in your extension where the minified script is loaded.

Here Joomla lessens your burden by automatically loading uncompressed version of the file if available in the same directory when debug mode is turned on.

So all you need to do is maintain the minified as well as uncompressed version of your script and stylesheet in your extension and turn on the debug mode.

Joomla also facilitates you to write different script and style specific to browser type and it version.

Like you have some scripting code which should only be loaded if the browser is mozilla.

Then create a file with name script_mozilla.js and put that browser specific code in this file.

Joomla automatically loads this file with no extra code instruction.

And similarly you can add the script specific to browser version.

Example : filename_browser.js , filename_browser_major.js, filename_browser_major_minor.js

where major and minor are the browser version names

These are some of the points that I have come across with while working on an extension.

And I am sure that there are lots more to explore.