Combine, Compress and Cache CSS and JavaScript

Combining and compressing files reduces the number and size of HTTP requests, which speeds up your website. PrestaShop takes the hard work out of combining, compressing and caching CSS and JavaScript by doing it all for you. It has the option to combine all external CSS files into a single CSS file and all external JavaScript files into a single JavaScript file. There is an option to compress inline JavaScript in HTML too. PrestaShop uses Douglas Crockford's JSMin Javascript minified ported to PHP by Ryan Grove for its compression and Smarty to cache the combined, compressed file. Go to the Preferences > Performance tab to enable these options.

Combine, Compress and Cache CSS and JavaScript

Choose the "Use CCC for CSS" option and "Use CCC for Javascript" options to compress CSS and Javascript. Choose "Compress inline Javascript in HTML after 'smarty compile' execution" to compress inline Javascript and "Minify HTML after 'smarty compile' execution to compress HTML. There is also a "High risk HTML compression" option, but it will cause your website to become non-standards compliant and it may cause problems with UTF-8 characters, so it is better not to enable that option.

Note that PrestaShop’s Combine, Compress and Cache feature will only work with themes based on the default PrestaShop v1.4 theme or later.  If you are using a theme designed for an earlier PrestaShop version, enabling the feature will cause problems.  Also, third-party modules may not be coded to take advantage of this feature.  For those modules, you will need to modify the hookHeader() function so that it uses code like the following to include its CSS file instead of linking it in a TPL file:

Tools::addCSS(_PS_MODULE_DIR_.$this->name.'/css/'.$this->name.'.css');

and the following to include its JS file:

Tools::addJS(_PS_MODULE_DIR_.$this->name.'/js/'.$this->name.'.js');

The third-party module’s CSS and JavaScript will then be combined and compressed along with PrestaShop’s modules.

PrestaTraining Videos

These training videos are provided courtesy of PrestaTraining.com, who make it easy to learn PrestaShop.