User Rating: 5 / 5

Star ActiveStar ActiveStar ActiveStar ActiveStar Active
 

As you know that Joomla will automatically includes Mootools library and some unneeded javascript to every page of your site, you might already familiar with this line of code:

<script src="/media/system/js/mootools-core.js" type="text/javascript"></script>
  <script src="/media/system/js/core.js" type="text/javascript"></script>
  <script src="/media/system/js/caption.js" type="text/javascript"></script>
  <script type="text/javascript">
window.addEvent('load', function() {
				new JCaption('img.caption');
			});
  </script>

Joomla will add this code to every page by default and there is no option or configuration to prevent Joomla doing this. I found a good blog post to remove JCaption in Joomla 2.5 at http://www.acuit.com.au/Blogs/removing-jcaption-in-joomla2.5.html but I think those solutions are complicated for me. And what I need is to completely remove Mootools library and only use jQuery library on my website so that my website will run faster enough. so here are the steps to remove Mootools library and also JCaption code from your page:

Removing Mootools and unneeded javascript from head tag

  1. open /libraries/joomla/document/html/renderer/head.php . this file is responsible to render the head tag of your pages 
  2. find this line of code
    // Generate script file links
    foreach ($document->_scripts as $strSrc => $strAttr)
    {	
    	$buffer .= $tab . '<script src="' . $strSrc . '"';
    	if (!is_null($strAttr['mime']))
    	{
    		$buffer .= ' type="' . $strAttr['mime'] . '"';
    	}
    	if ($strAttr['defer'])
    	{
    		$buffer .= ' defer="defer"';
    	}
    	if ($strAttr['async'])
    	{
    		$buffer .= ' async="async"';
    	}
    	$buffer .= '></script>' . $lnEnd;
    }
  3. We will add some codes to ignore these javascript files: mootools-core.js, mootools-more.js, core.js, tabs-state.js, caption.js, jquery-noconflict.js, jquery-migrate.min.js , I found this solution from Brad Markle w/ InMotionHosting.com,  ok so update these lines of code so that it will looks like:
    // Generate script file links
    foreach ($document->_scripts as $strSrc => $strAttr)
    {
    	 // Code to disable mootools for your site (still loads it for your admin)
    	// Written by Brad Markle w/ InMotionHosting.com
    	$ex_src = explode("/",$strSrc);
    	$js_file_name = $ex_src[count($ex_src)-1];
    	$js_to_ignore = array("mootools-core.js","mootools-more.js","core.js","tabs-state.js","caption.js","jquery-noconflict.js","jquery-migrate.min.js");
    	if( in_array($js_file_name,$js_to_ignore) AND substr_count($document->baseurl,"/administrator") < 1 AND $_GET['view'] != 'form')
    		continue;
    	$buffer .= $tab . '<script src="' . $strSrc . '"';
    	if (!is_null($strAttr['mime']))
    	{
    		$buffer .= ' type="' . $strAttr['mime'] . '"';
    	}
    	if ($strAttr['defer'])
    	{
    		$buffer .= ' defer="defer"';
    	}
    	if ($strAttr['async'])
    	{
    		$buffer .= ' async="async"';
    	}
    	$buffer .= '></script>' . $lnEnd;
    }

Removing JCaption code

Now we will remove these lines of code:

<script type="text/javascript">
jQuery(window).on('load',  function() {
				new JCaption('img.caption');
			});
  </script>
  1.  open/libraries/cms/html/behavior.php and find this function :
    public static function caption($selector = 'img.caption')
  2. and then comment the code which adds the caption.js to the head tag and also comment the code which attach JCaption code to the page:
    //JHtml::_('script', 'system/caption.js', true, true);
    
    // Attach caption to document
    /*JFactory::getDocument()->addScriptDeclaration(
    	"jQuery(window).on('load',  function() {
    		new JCaption('" . $selector . "');
    	});"
    );*/

     

and that's it, now your joomla site will load a little bit faster without Mootools

Update January 16, 2014

Removing JavaScript code from head tag

I found a simple solution to clear the head tag from JavaScript codes. Here is the code:

$this->_scripts = array();
unset($this->_script['text/javascript']);
$templateurl = $this->baseurl.'/templates/'.$this->template;
$doc->addScript($this->baseurl . '/media/jui/js/jquery.min.js', 'text/javascript');	
$doc->addScript($templateurl . '/css/bootstrap/js/bootstrap.min.js', 'text/javascript');

Put this code at the top of your template's index.php file. Basically this code will remove all script files and javascript code from head tag and then we add our js files using addScript method.