Speed Up WordPress – Ultimate Guide To Make Sites Super Fast

A good website should never compromise on the visitor’s experience. A Serious web publisher invests some time and resources to learn everything possible about optimizing his website for speed. Who likes to browse through a sluggish slow loading site? Most of the normal visitors leave the site, unless the visitor is extremely interested in the content and related things. More over google started considering the sites speed as a factor in their search engine ranking logarithm. This guide will help you in reducing your sites server load, making your site faster.

Remember speeding up and optimizing your wordpress site is not an easy process, it take a bit of time to make the changes properly and safely. But its worth if you can spend the time. The time taken will depend on your expertise in wordpress. Before making the following changes my sites was taking around 11 – 15 seconds to load.  After implementing these changes the site takes less than 5 seconds to load.

Before starting with any thing, first take a complete back up of your theme files and your wordpress database. Now go to http://tools.pingdom.com and enter your site url and do  a speed test to see how long does it take for your website to load (You do speed test at last, after implementing the changes in this guide to know the speed gain you have obtained). Our aim is to reduce the load time and server load to a much lesser value.

So lets start the Ultimate Guide To Make Your Site Super Fast

1) Remove Unnecessary PHP Queries and Database Access

Almost all wordpress themes are made in such a way that there is minimal user effort in configuring them. These themes comes with some generic php codes, which can be easily replaced after we install it in our blog. Removing these avoidable php queries will lessen your server load and also make your site faster.

For this first open the header.php files located in your current themes folder. You can do this by two ways, either by going to Appearence > Editor from wp dashboard or by accessing the file directly using a FTP client and opening in Notepad or Notepad++.

You’ll some thing like this in the header file.

<title><?php bloginfo(‘name’); ?> <?php bloginfo(‘description’);?></title>

<link rel=”stylesheet” type=”text/css” media=”screen” href=”<?php bloginfo(‘stylesheet_url’); ?>“/>

<link rel=”shorcut icon” type=”image/png” href=”&lt?php bloginfo(‘template_url’); ?>/favicon.jpg” />

<link rel=”alternate” type=”application/rss+xml” title=”RSS Feed” href=”<?php bloginfo(‘rss_url’); ?>” />

The bolded items in this code is the php code. These five php commands are executed each time, when your site gets loaded in the browser. Since we dont want the theme to be portable anymore, we can replace these php queries by corresponding html code. That’s about 20 Times Faster Speed.

To do this open your site in any browser for eg in chrome and press Ctrl + U or select View Source From the menu. With reference to the above example, you will see the source code of the site as

<title>Computing Unleashed</title>

<link rel=”stylesheet” type=”text/css” media=”screen” href=”http://www.computingunleashed.com/wp-content/themes/amalroy/style.css”/>

<link rel=”shortcut icon” href=”http://www.computingunleashed.com/wp-content/themes/amalroy/favicon.png” type=”image/png” />

<link rel=”alternate” type=”application/rss+xml” title=”RSS Feed” href=”www.computingunleashed.com/feed/rss/” />

Now you might have got an idea about this. Now just copy these codes and replace it in header.php file and save the file and you are done. You can now check for similar queries in footer.php, sidebar.php etc. and replace them.

2) Remove Inactive Plugins

Most of us are curious to try out new wordpress plugins.We deactivate them if we are not happy with the results. There is a tendency for us to leave those deactivated plugins in the plugin directory. Its better to remove all those inactive plugins that you dont use. Also check for any plugins that you have activated but not using, these can eat up resources simply. So make the plugin directory clean and tidy. If you feel that you might want to use those deactivated plugin later on, then make a text document in the plugin directory with the list of plugins you need later and you can safely delete those plugins which are not needed now.

3) Using a  FREE CDN (Content Delivery Network)

A content delivery network is used by almost all popular websites like google, twitter, mashable etc. A content delivery network (CDN) is a collection of web servers distributed across multiple locations to deliver content more efficiently to users. The user’s proximity to your web server has an impact on response times. Deploying your content across multiple, geographically dispersed servers will make your pages load faster from the user’s perspective.

Using a CDN network will improve your sites response time to a great extend. But normal users find it difficult to afford a CDN service. But there is a free alternative.

CoralCDN allows us to take full advantage of a powerful CDN without spending a dime. How to use it? Well, basically, just append `.nyud.net` to the hostname of any URL, and that URL will be handled by Coral.

With the Free CDN this job can be done easily. All you need to do is just install the plugin and activate it. It will rewrite the JavaScripts, CSS, images etc. for you. PLus it also  has option to exclude or include the files your specify. It can be JavaScript’s, CSS or specific pages.

4) Keep Your WordPress Version Up To Date

With the release of new versions, wordpress keeps on improving on the whole. On each update wordpress developers put their effort in making wordpress faster and safer. So its very necessary that you need to upgrade to the latest wordpress version to get the performance improvements and new features.

5) Compress the CSS Code

Compressing your CSS Code will make it’s size small and your browser can render it faster and that results in faster page load times. Compressing the CSS can be done in two ways. Either by doing it manually by using the service CSS Drive. You have to manually copy-paste your css code from the style.css file in their website and you will get the compressed version of it which you can paste back on the style.css file.

But if you make changes to your css code at times, then its better to use the WP CSS plugin. Wp css plugin will automatically remove the white spaces and compress your css files. Plus you will also have other options to set expiry time for the files.

6) Optimize the WordPress Database

Just like the hard disks the wordpress database also gets fragmented. So optimizing the wordpress database too can speed up your site.

• For optimizing the wordpress database of your site, visit the cpanel of your hosting provider.
• Use phpMyAdmin to optimize your database: Log in to phpMyAdmin, select all the tables, and then repair and optimize.

7) Compress & Combine Javascript Files

Like the CSS files the javascripts in your template is also a major reason for speed loss.

Try to reduce the javascripts as much as possible.

Javascript Compression Services

• Javascript Compressor
• JS Compressor

8 ) Reduce Image Sizes

Posts become lively when images are added. But using high resolution images on your site will put a high load on the server and this is one of the reasons why some sites go down when a digg front page is reached.

The images can be compressed to a level without much loss in quality.

You can use the WP Smush.it plugin for wordpress to compress the images. It will compress the images to a good extend and your site will load faster now.

9) Disable Hot Linking

Stealing our websites bandwidth can be referred to as Hot linking. This happens when others link your sites images in their articles and this puts load on your server. This not a big issue if one or two sites directly link your images, but if multiple sites uses this then it might create a headache.

We can easily prevent the hotlinking by implementing a small code in the .htaccess file.

#disable hotlinking of images with forbidden or custom image option

RewriteEngine on

RewriteCond %{HTTP_REFERER} !^$

RewriteCond %{HTTP_REFERER} !^http(s)?://(www.)?computingunleashed.com [NC]

RewriteCond %{HTTP_REFERER} !^http(s)?://(www.)?google.com [NC]

RewriteCond %{HTTP_REFERER} !^http(s)?://(www.)?feeds2.feedburner.com/PersonalComputingUnleashed[NC]

RewriteRule .(jpg|jpeg|png|gif)$ – [NC,F,L]

Copy-paste the above code in your .htaccess file in the wordpress root directory and then save it. !Important – Replace my sites url and feed with yours.

10) The WordPress Super Cache Plugin

The super cache plugin is a must have plugin that cache’s the mostly visited pages on your site and make it available the next visitor immediately. The plugin generates html files which are served without ever invoking a single line of PHP.

Download WordPress Super Cache Plugin

But if you have good experience with plugins and wordpress then I’d recommend the w3 Total Cache Plugin which tops any of the cache plugin and is my personal favorite. If you could properly configure the w3 total cache plugin then its the best. It has much better compressions and caching options than the super cache plugin and definitely save your websites bandwidth and improve your sites speed. Whats more it has even got cdn support. This will help you avoid other plugins if you’ve got a  cdn account or an amazon s3 account. This plugin also has separate caching options for shared hosting and (vps, dedicated hostings). This makes it so special.

Download W3Total Cache Plugin

11) Combining Javascripts and CSS Files with PHP Speedy

As said earlier, minimizing the HTTP requests can speed up the site greatly and the php speedy plugin will help you further by combining all the javascripts into one single file and all css files into a single one. Therefore in total the there will only be two files that are being requested.

The results after using the php speedy plugin.

Download PHP Speedy Plugin For WordPress

12) Preloading the Page Contents

This is some thing that doesn’t improve the performance much but it enhances the page load by loading the page progressively. The problem with putting style sheets near the bottom of the document is that it prohibits progressive rendering in many browsers, including Internet Explorer. These browsers block rendering to avoid having to redraw elements of the page if their styles change. The user is stuck viewing a blank white page.

So here’s what you have to do. Move the Style Sheets to the header file.

<title>Computing Unleashed</title>

<link rel=”stylesheet” type=”text/css” media=”screen” href=”http://www.computingunleashed.com/wp-content/themes/amalroy/style.css”/>

Move the css file link near the title in the header.php file.

13) Flushing the buffer

When users request a page in your site, it can takes around 200 – 500 milliseconds for the backend server to put together the HTML page. During this time the browser remains idle. The flush() function in php help you in loading the partially ready html response to the browser and it can start fetching the components, while the backend server is busy with the rest of the contents.

To inset the flush() function in your wordpress site, Open up the header.php file and find the </head> tag and insert the <?php flush(); ?> function right after it. You may see the eg below.

</head>

<?php flush(); ?>

<body>

14) Using CSS Sprites Technique

It simply means combining all the images in the site into a single big image containing all of them and the browser loads the single big image and display the different images by using background-position.

If you are using a lot of static images in your site then it is definitely worth to try the css sprites technique. It not only speed up your site, but also reduce the http requests. Here you can know about the complete CSS Sprites and its implementation in here.

15) Add Header Expire To Static Contents

Adding an expiry time to static images can reduce further HTTP requests when loading other pages in the site. Adding an expiry time to the images in the site help in loading the pages faster.

Copy and Paste the Following Code in your .htaccess file.

ExpiresActive On
ExpiresByType image/gif A28800
ExpiresByType image/png A28800

ExpiresByType image/jpg A28800

ExpiresByType image/jpeg A28800

16) DB Cache Reloaded Plugin

The DB cache plugin works differently from the super cache plugin by optimizing your database alone. It caches WordPress’s MySQL queries to a file. This results in less space being used for caching and faster performance from the WordPress blog.

Download DB Cache Reloaded Plugin For WordPress

Apart from all these criteria, the websites speed also depend upon other factors such as type of hosting you have chosen, the number of javascripts and css you use etc. VPS hosting will have more speed compared to the normal shared hosting that many of the wordpress blogs use.

I am sure that if you can implement these steps properly it will definitely speed up your wordpress blog by a great amount.

There may be many more ways to speed up your wordpress site. I have shared some of my knowledge here to speed up your site.

So, if you know more ways to speed up wordpress, then please do share it, by commenting below.