Why Page Speed is so important
- Web surfers are very impatient.Slow loading speeds cause them to press the back button.
So you are loosing money if the impatient web surfer (read
Client/Customer) coming to your website hits the back button due to slow
load time
- Slow speeds are used in Google’s ranking algorithm.
Which means that slower the website, lower the Google Rank.You might never get to the first page in Google’s Search result.
How to check Page Speed?
Simple, ask Google. Go to
Google Page Speed Online.
Remember, this tool measures pages, not entire websites. So, test and
optimize each page (or the important and most visited ones) separately.
And Don't forget to test for Mobile
Google
Page Speed also has feature to test your site for mobile devices. With
more and more users using internet from their handheld devices, having
slower internet connection, you cannot afford to ignore that.
How to Increase Page Speed
Note : The Steps to increase the Page Speed listed here are for WordPress Sites only.
Step 1: Get the Actual Page Score Before we start
Use
Google Page Speed to analyze your page speed. We will analyze the Page
Speed regularly. Please Note sometimes after we do the changes, the Page
Speed is not immediately affected. You might have to wait for few
minutes to see the change.
Now, to increase Page Speed, first of all I referred a Guide on WP Tuts + :
The Ultimate Quickstart Guide to Speeding Up Your WordPress Site.
The Major difference that I saw in my Page Speed is due to this guide. I
am listing the steps provided in that guide here for your easy
reference
Step 2: W3 Total Cache
If you are using any other caching plugin , Please deactivate it!
Head over to your “Add new” plugins section within the WordPress, search “W3 Total Cache” , install it and activate it
Once W3 Total Cache is switched on you will see a new sidebar tab called “Performance”, click it.
Let’s first look at the “General Settings”, you will want to tick the following boxes (to enable):
- Page
Cache (select “Disk: Enhanced” in the drop down) – Caching pages will
reduce the response time of your site and increase the scale of your web
server.
- Minify
(Select “Manual”, leave the other settings) – Minification can decrease
file size of HTML, CSS, JS and feeds respectively by ~10% on average.
- Do not tick Database cache (we will sort this later via a different method)
- Object
cache (select “Disk” in the drop down) – Object caching greatly
increases performance for highly dynamic sites (that use the Object
Cache API).
- Browser Cache – Enable HTTP compression and add headers to reduce server load and decrease file load time.
- Leave
CDN, Varnish & cloudflare untouched. (again to do this quick upload
the settings file included in the “source files” via the option at the
bottom of the “General Settings”)
Step 2B: Get Cracking with Minify
- Click
the “Minify” tab/link at the top of the W3 panel/page. In the “HTML
& XML” section make sure that the first three boxes are checked.
- Then click the “Help” button at the top.
Once this popover loads up you will be faced with a list of JavaScript
files, followed by style sheets that your site is linking to. Essentially
we want to try and tick everything EXCEPT:
- Jquery files
- Google ads (or any ads for that matter)
- Any stats.wordpress.js files (you will have these if you have jetpack installed
However
for CSS you can pretty safely select all of them. Now this isn’t an
exact science as this is minifying your theme files (Don’t worry it’s
non destructive) and there are a lot of different themes all employing a
wide range of different files, plugins and functions. Basically preview
your changes before submitting them.
Minify is one of the biggest
improvements you will be integrating, once you have selected all your
files (and done the same with every theme, if you are using more than
one) then click “Apply & close”, directly followed by “Save all
settings” (Deploy it if your site still looks/works the same).
Step 2C: Head Over to Browser Cache…
Once
your in the “Browser Cache” tab/page you will need to change the
“Expires header lifetime” to 691200 seconds. This will immediately boost
your ySlow score.
Now head back to “General Settings” and click
“empty all caches”, then go to your homepage and run the ySlow test
again, you should see a nice improvement.
Step 3: Install Database Manager Plugin
In the Same tutorial, I also followed the
Step 3: Let’s get back to that pesky Database optimization. You will need to Install and Activate
WP-DBmanager
Below the “Performance” sidebar tab in the WordPress backend there
should be another tab with the name “Database” (if not then go back and
activate it).
Now this is very simple you need to do three things, backup, repair, optimize.
To backup click the “Backup DB” then at the bottom click “Backup” (Don’t worry about gzipping).
Next
up we want to repair your database (just in-case) so go to the “Repair
DB” in the sidebar. Click the “Repair” button at the bottom.
Lastly,
optimize it. Click the “Optimize DB” sidebar button & yep you’ve
guessed it, click the “Optimize” button at the bottom.
To avoid
this process again pop into the “DB Options” sidebar tab. At the bottom
there will be an “Automatic Scheduling” section. Ensure that backups are
done EVERY DAY (you can’t be too careful) then set it to optimize say
every few days and repair once a week. Then save the changes.
Step 4: Time for Image Compression
Large Images really slows done your site. Loss-less Compression can come to rescue. I used
Image Compressor 2008 However, there are many other good compressors available that you can use.
Step 5: Leverage Browser Caching
This Step is from another Great Guide
How to Leverage Browser Caching in WordPress via htaccess
Open up your .htaccess file and paste in the following directives at the top of the file:
## EXPIRES CACHING ##
ExpiresActive OnExpiresByType image/jpg "access 1 year"
ExpiresByType image/jpeg "access 1 year"
ExpiresByType image/gif "access 1 year"
ExpiresByType image/png "access 1 year"
ExpiresByType text/css "access 1 month"
ExpiresByType application/pdf "access 1 month"
ExpiresByType text/x-javascript "access 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresByType image/x-icon "access 1 year"
ExpiresDefault "access 2 days"
## EXPIRES CACHING ##
Step 6: Do the Housekeeping
- Removing “broken links”, or requests that result in 404/410 errors, avoids wasteful requests.
- Remove unnecessary Plugins. And Keep the Plugins upto Date
- Upgrade to latest version of WordPress as and when new version is released
This covers pretty much everything…. Now is the time to check the Score.
Don't Forget to reply below with the change in speed you observed in your site
