WordPress is a very popular Content Management System (CMS) and there are hundreds of thousands of WordPress websites online.
An important aspect of building websites with a CMS is that it needs to be optimised for least resource utilisation and faster page loading. There are various techniques used in optimization. This includes caching, gzip compression, enabling pagespeed module (Apache server) etc. Some of the effective techniques are given in this tutorial.

WordPress supports lot of caching plugins. One of the most effective caching plugin supported by WordPress is ‘W3 Total Cache‘. It can be installed easily from the WP admin panel.

If you already have a wordpress web hosting service, go to WP admin >> Plugins >> Add New >> Search the plugin in search tab and Click Install Now. Here is the screenshot of it.

wordpress-op-01

Click the link Activate Plugin to activate the installed W3 Total Cache plugin.

install_plugin

This will enable the plugin and you can see the installed plugins in WP Admin >> Plugins >> Installed Plugins.

activate-plugin

 

You’ll be able to see ‘Performance‘ option in the side menu if the plugin is installed correctly. Click on Performance tab and that will give you the customization and settings options. Goto General Settings tab.

wordpress-op-02

1st option is to toggle all types of caches. This is tricky because there are lot of caching options like CDN etc. If it is not enabled for your website, there is no point in enabling the CDN cache. So you can enable each cache option one by one. Make sure that the options are installed/enabled in the server if necessary.

The following screenshots will guide you through the caching options.

First option is Page Cache. Enabling this will cache all the website pages and this will reduce the response time.

Please note that if you don’t clear the cache after updating the pages, it won’t show up in the website. You can clear the cache from Performance option in the top of this page.

wordpress-op-03

Next is Minify option. This will reduce the size of CSS and JS files and thereby reducing load time.

wordpress-op-04

 

In this tutorial, the Minify cache method used is Opcode: Alternate PHP Cache (APC) because we have enabled it in our test environment. How to enable APC can be found here: <LINK TO INSTALL APC CACHE>. If you don’t like any other Opcode caches, you can choose ‘Disk’ as the Cache method.

Next option is to cache Database objects. This can increase response time to a greater extend as the database queries need not be run every single time.

wordpress-op-05

You can also enable Object caching, don’t confuse PHP objects and database objects.

Next is Browser cache and CDN. If browser cache is enabled, HTTP headers are compressed this helps in loading the files easier.

wordpress-op-06

If CDN is not activated for your website, you can leave that option.

Next options are to enable Varnish Cache purging and Monitoring the website performance.

wordpress-op-07

This options is effective only if Varnish cache reverse proxy and New Relic performance analytic tool is enabled in the server.

These are caching methods available with W3 Total Cache. AFter enabling these caching options, you can see considerable improvement in the website performance in terms of response time. You can analyze the performance with various tools for eg: Google Pagespeed tool, GT Metrix etc.

Use CDN (Content Delivery Network)

CDN enables your static data to be cached in multiple servers located in the different parts of the globe and when requested for the contents, it will be fetched from the nearest available CDN server. This will help in receiving the static contents faster as opposed to getiing from the actual server which is further far away and this decreases network connectivity time to a great extend. Enabling CDNs increases the response time really well.

Optimize Images

Page speed can be reduced considerably by reducing the size of the images that are loading.

* Use images with correct size, i.e, the actual size of the image and the size disaplayed should be same.
* Use sprites for themes.
* Remove unnecessary widgets.
* Remove additional data from images like date etc (Smush images)

Enable gZIP compression

gZIP compression compresses the data like CSS, JS files, images etc. to be transferred between the server and client. This makes the communication much fastrer and thereby reducing the load time.

For enabling gZIP compression, add the following code in the .htaccess file present in the Document Root of the WordPress website.

## ENABLE GZIP COMPRESSION ##
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
## ENABLE GZIP COMPRESSION ##

Leverage Browser cache

Every browser caches the website data and you can specify the time of caching. This can be done by adding the following code in the ‘.htaccess‘ file present in the WordPress installation directory.

## LEVERAGE BROWSER CACHING ##
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg "access 2 month"
ExpiresByType image/jpeg "access 2 month"
ExpiresByType image/gif "access 1 month"
ExpiresByType image/png "access 1 month"
ExpiresByType text/css "access 1 month"
ExpiresByType application/pdf "access 1 month"
ExpiresByType application/x-javascript "access 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresByType image/x-icon "access 1 year"
ExpiresDefault "access 5 days"
</IfModule>
## LEVERAGE BROWSER CACHING ##

Enable Hotlink Protection

Hotlink is the process in which other websites link the data in your website (eg: images or videos) to the contents in their page. So if a user access the hotlinked image or video file from their website, it is actuall loading from your website. This actually increases your bandwidth usage and also increases the server resource usage. We can disable this feature by enabling Hotlink Protection.

Use the following code in the .htaccess file (Documet Root) to enable Hotlink protection.

RewriteEngine on
 RewriteCond %{HTTP_REFERER} !^$
 RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?sparringmind.com [NC]
 RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?google.com [NC]
 RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?feeds2.feedburner.com/sparringmind [NC]
 RewriteRule \.(jpg|jpeg|png|gif)$ – [NC,F,L]

Optimize Databases
Most of the load time of a website is consumed by the database queries and information retrieval from databases especially in cases with big websites with huge databases. So it is important to optimize the queries to make the website load faster.

We hope that you have found this useful in helping you to optimize your WordPress site.

Leave a Reply

Your email address will not be published. Required fields are marked *