Enable GZIP Compression and Browser Caching

PrestaShop makes it easy to enable GZIP compression and browser caching on your website. Just upload a blank .htaccess file to the root directory of your server and give it chmod 666 permissions, then go to the Tools > Generators tab in the Back Office. In PrestaShop v1.4 and above, tick the "Optimization" checkbox, then click the "Generate .htaccess file" button to create an .htaccess file that enables GZIP compression and browser caching. In PrestaShop v1.3 and below, this checkbox will not exist, so you will need to manually copy the code below to the bottom of your .htaccess file.

<IfModule mod_expires.c>
	ExpiresActive On
	ExpiresByType image/gif "access plus 1 month"
	ExpiresByType image/jpeg "access plus 1 month"
	ExpiresByType image/png "access plus 1 month"
	ExpiresByType text/css "access plus 1 week"
	ExpiresByType text/javascript "access plus 1 week"
	ExpiresByType application/javascript "access plus 1 week"
	ExpiresByType application/x-javascript "access plus 1 week"
	ExpiresByType image/x-icon "access plus 1 year"
</IfModule>
FileETag INode MTime Size
<IfModule mod_deflate.c>
	AddOutputFilterByType DEFLATE text/html
	AddOutputFilterByType DEFLATE text/css
	AddOutputFilterByType DEFLATE text/javascript
	AddOutputFilterByType DEFLATE application/javascript
	AddOutputFilterByType DEFLATE application/x-javascript
</IfModule>

The code in the first if statement above enables browser caching of images, CSS, JavaScript and icons. It instructs the browser to cache images for 1 month, CSS and JavaScript for 1 week and icons for 1 year. This means that the second time a customer visits your website, the images, CSS, JavaScript and icons will be read from the customer's browser cache instead of re-downloaded, which will reduce the load time.

The FileETag line above enables ETags on your server. ETags are used instead of the last modified date to determine whether content has changed before it has expired. If the content has changed, then it is re-downloaded instead of waiting for it to expire. Note that Yahoo recommends disabling ETags to improve performance. To disable ETags, change the line to:

FileETag none

Note though that if you disable ETags and then change an image, CSS, JavaScript or icon, it will not be re-downloaded until it has expired or the customer clicks the Refresh button in their browser. That means that it may appear as though your modified images, CSS, JavaScript and icons are not updating. You must remember to refresh your browser whenever you modify these files.

The code in the second if statement above enables GZIP compression on HTML, CSS and JavaScript. GZIP compression generally reduces the size of text files by about 70%, which greatly reduces the time it takes to download the files and saves bandwidth. Note that some servers do not support GZIP compression, so this code will have no effect. In that case, you will need to ask your host to enable GZIP compression or move to another host that does support GZIP compression.

PrestaTraining Videos

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