SiteGround Mod_pagespeed – How to Enable and Configure

In the last tutorial, we looked at how to use the SiteGround “SuperCacher” tool in order to enable the various Varnish static and dynamic caches. While these are useful, they perform no optimization of your website structure itself. They simply allow the existing process to be carried out faster. However, there are a large number of implementations that can substantially improve the speed of your site even without any caching. We’ve covered some of these before such as Minification, CSS and JavaScript file consolidation, and asynchronous loading. WordPress plug-ins like W3 Total Cache and WP Super Cache have options to carry out these procedures in addition to automatic page caching.

But there is yet another module which really takes your website to the next level in terms of site optimization. And that is mod_pagespeed. It’s a Google server-side module released several years ago incorporating best practices from dozens of angles ranging from prioritizing online CSS, to serving WebP images instead of JPEG ones, progressive image loading, JavaScript and CSS repositioning etc. SiteGround offers a mod_pagespeed implementation which is awesome because many other big-name hosting companies like BlueHost and Godaddy don’t allow it on their shared hosting plans.

So let’s see how to enable and configure mod_pagespeed on SiteGround, what is included by default, and what we need to add on, and how.

Enabling Mod_pagespeed

to get started, log into the cPanel section of your SiteGround account, and locate the “SuperCacher” icon as you did before for enabling the Varnish caches.

On the resulting page, you can scroll down to find the mod_pagespeed module. If you’ve already configured your Varnish caches, it’ll be disabled. This is because you can only have one of the two modules active – either Varnish, or Google’s mod_pagespeed. Enabling either one will automatically disable the other. So it might be worthwhile to check out the relative impacts on the page loading speed when each of them is enabled.

Having said that, simply change the status of mod_pagespeed to “on”.

Now that it’s up and running, click the button labeled “Advanced” to bring up the default directives included at first.

You can see that mod_pagespeed is switched on, and the director known as “extend_cache” is enabled. This latter option includes a host of changes such as rewriting static URLs as well as setting the “max-age” header to a high-value in order to optimize subsequent page loads of the same site. In the screenshot below, you can see the URL rewriting at work on a sample JavaScript file.

Improving Mod_pagespeed

To begin with, SiteGround only includes something known as “core filters” with mod_pagespeed. While these can give a substantial post your site and are also the safest to implement, there are many other directives which can have a dramatic impact on your page load speeds. Visit the official mod_pagespeed documentation website to see what else you can include. To give you an example of the additional power at your fingertips, I’m going to include a directive that changes all JPEG image files to Google’s WebP format that saves bandwidth while maintaining a high degree of visual fidelity. To do this, I’m going to pick up the direcive known as “convert_jpeg_to_webp”. Open the “Advanced” mod_pagespeed dialog box and add the following line below the existing ones:

ModPagespeedEnableFilters convert_jpeg_to_webp

Save your changes and flush the cache. Here is an example of a JPEG image on my website before I had added the line:

And once the mod_pagespeed filter kicked in, here is the very same image converted into the WebP file format:

<

p style=”text-align: center;”>  

That’s pretty neat! Using just one line, you have implemented sitewide changes that can have a huge impact especially if you have a lot of pictures on your blog. Mod_pagespeed is a site independent module, meaning that it doesn’t matter what you run. Using the set of core filters and additional ones picked up from the mod_pagespeed documentation site, you can have perfectly optimized webpages.