If you run a high traffic or image heavy WordPress installation then you will want to optimize your WordPress. When we created Fawked Network, it was running 99% images and loading the front page took almost 25 seconds. After optimization, we managed to cut loading times down to about 2.5 seconds.
With tons of great plugins available, users can easily create websites that are full featured with lots of neat functionality. However, these plugins can add additional JavaScript and CSS into your sites headers which can affect your site\’s performance. This tutorial aims to give you a rough idea what you need to do to optimize your WordPress powered website for speed.
Before you begin, visit http://gtmetrix.com and test your site. Make a screen shot of your score, then after optimizing, re-test and see if there are any improvements.
The test subject
For this tutorial, we disabled all optimization for Fawked.net. Below were the scores from GTMetrix without any optimization.
We reduced the front page to show only 7 posts instead of the initial 15 and a social plugin was replaced with Jetpack\’s social plugin instead. The social plugin that we replaced was adding about 10 seconds to the loading scores.
What you need to optimize WordPress
CloudFlare
CloudFlare is really awesome because it speeds up your site and adds an extra layer of protection for free. However, when we were preparing this tutorial about 2 or 3 weeks ago, the entire CloudFlare network was down for about 30 minutes.
Despite the downtime, we are still sticking with CloudFlare because there\’s simply no other product quite the same like what CloudFlare is offering.
Below are the scores with CloudFlare on but without Auto Minify.
Next we enabled Auto Minify. Auto Minify automatically minifies Javascript and CSS for your web pages resulting in smaller scripts and faster load times.
With Auto Minify we managed to shaved a few miliseconds from the total loading time. It\’s also worth noting that having CloudFlare on without Rocket Loader made no difference to the loading times.
W3 Total Cache
W3 Total Cache is the simplest caching tool for WordPress. You can get it setup in a few minutes but there are plenty of options that you can tweak to further optimize your site.
We still weren\’t happy with the scores we were getting and we wanted to push it a bit further. We wanted the number of requests to go below 70 so we tried to have both Auto Minify on CloudFlare and Minify on W3 Auto Cache on at the same time.
If Network Security and Performance by CloudFlare is enabled on W3 Total Cache, the plugin will not allow you to enable Minify on W3 Total Cache. The only way would be to disable Network Security and Performance by CloudFlare on W3 Total Cache.
We were having issues when trying to enable Minify options on W3 Total Cache as it would keep giving us a 404 error. If you have getting errors when trying to enable Minify, you can manually edit the config files to enable the options.
The file to edit should be located here > wp-content/w3tc-config/master.php
‘minify.css.enable’ => true,
‘minify.css.engine’ => ‘css’,
‘minify.css.combine’ => true,
‘minify.css.strip.comments’ => false,
‘minify.css.strip.crlf’ => false,
‘minify.css.imports’ => ”,
‘minify.css.groups’ => array(
),
‘minify.js.enable’ => true,
‘minify.js.engine’ => ‘js’,
‘minify.js.combine.header’ => false,
‘minify.js.header.embed_type’ => ‘blocking’,
‘minify.js.combine.body’ => false,
‘minify.js.body.embed_type’ => ‘blocking’,
‘minify.js.combine.footer’ => false,
‘minify.js.footer.embed_type’ => ‘blocking’,
‘minify.js.strip.comments’ => false,
‘minify.js.strip.crlf’ => false,
‘minify.js.groups’ => array(
),
‘minify.upload’ => true,
‘minify.html.enable’ => true,
‘minify.html.engine’ => ‘html’,
‘minify.html.reject.feed’ => true,
‘minify.html.inline.css’ => true,
‘minify.html.inline.js’ => true,
‘minify.html.strip.crlf’ => true,
‘minify.html.comments.ignore’ => array(
0 => ‘google_ad_’,
1 => ‘RSPEAK_’,
),
The codes above is not the entire config file, just snippets of what we manually edited. We suggest you tinker about and see what works for your site and what doesn\’t.
There has to be a reason why W3 Total Cache doesn\’t allow Minify and Auto Minify to be enabled at the same time. We suggest you make back ups before attempting to change any configurations. Do leave a comment if you know why both Minify and Auto Minify is not allowed to be enabled at the same time.
WP-Optimize
WP-Optimize is a WordPress database cleanup and optimization tool that doesn\’t require PHPMyAdmin. With a few clicks you can optimize your database by removing post revisions, auto drafts, comments in spam queue in a few clicks.
WP-Optimize also shows you how much space you can safe by optimizing your database.
While we did not encounter any issues with this plugin, its best practice to always make a backup especially when using automated scripts that involves your database and codes.
Conclusion
Try out the methods in this tutorial and let us know how it has worked for you. Do remember to take before and after screen shots.
