Achieve 99% in GTMetrix easily

Finally! I achieved the grade of double 99% in Gossamer Threads metrix using my old Jehzlau Concepts theme that I will make publicly available for download very soon. I’m still tweaking my theme and removing unnecessary codes to achieve 100% loading speed.

I got a perfect score of A on Page Speed grade and almost perfect score of A with one B on Yslow grade. I’ll be updating this post soon about the things I did and server modifications I made to achieve such blazing fast page load speed!

Right now I’m using Timepiece from WordPress.com. This one is slower (95% PSG and 94% YSG) compared to my default Jehzlau Concepts theme, but I’ll try to make this faster to achieve the 99% page load speed grade like my previous theme. I love this theme because it’s sleek and responsive and I think I’ll be using this from now on. [UPDATE 10/04/12 9:08AM: After a few tweaks in the Timepiece theme, I’m able to achieve double 99%, check this out!]

If you’re curious about how fast your website or blog loads, check your page speed grade now at GTmetrix.com.

Will update this post again tomorrow.

UPDATE 10/03/2012 11:59 PM:

Steps to achieve a double 99% (or just a double A) in GT Metrix

STEP 1: First thing to do in order to achieve a double 99% (or at least a double A grade) in your GTmetrix score is to check whether your server can reach a perfect score in both YSpeed and Page Grade when hosting a text-only page. No javascript, html tags, or anything, just plain text inside an html file. To do this, just add an index.html file in your public_html or domain folder with a random text you want—or perhaps leave it empty. Then, test your page speed in GTmetrix.com. See what I achieved below when testing a hosted text-only index.html in my server:

Take Note: If you didn’t score 100% in both PageSpeed and YSlow @ GTMetrix.com, then your chances to achieve a double 99% (or at least double A) in your WordPress blog with images, CSS, javascript and other contents are slim (but still, it’s achievable by implementing the next steps that I’ll be sharing in this blog post).

STEP 2: Remove unnecessary plugins in your WordPress blog. If you have a lot of plugins that is not really useful, remove it now, it will help speed-up the loading time of your WP blog.

STEP 3: Remove query strings from static resources. This can significantly speed-up your website. If you have query strings like style.css?versionblahblahblah or javascript.js?versionblahblahblah, remove those will help your site load faster. You can’t remove it manually in your header.php file, so you need to add these in your functions.php file (create one if you don’t have this file in your theme):


function _remove_script_version( $src ){
$parts = explode( '?', $src );
return $parts[0];
}
add_filter( 'script_loader_src', '_remove_script_version', 15, 1 );
add_filter( 'style_loader_src', '_remove_script_version', 15, 1 );


STEP 4: Install W3TC (W3 Total Cache plugin). If you already installed this WordPress plugin, Enable the following features: Page Cache (Disk Enchanced), Minify (Auto), Database Cache (Disk), Object Cache (Disk), Browser Cache, and CDN (if you have one).

STEP 5: Optimize all the images in your post using Kraken.io or Yahoo! Smush.it. There’s a nifty plugin by called WP Smush.it to compress all the images in your website with just one click.

STEP 6: Replace your default image emoticons with Pure CSS emoticons. This will also improve your blog’s loading speed, because all your smilies are now CSS-based. This WP plugin wasn’t updated for more than 2 years, but it’s still compatible with the latest version of WordPress (Version 3.6.1 as of writing this post)

STEP 7: After doing steps 1-6, your page load speed will significantly increase. To furthermore speed up your WP blog, you can either using Google PSS by signing up here and wait your site to be approved, then follow their step-by-step instructions. Alternatively, you can use Cloudflare (a CDN that can greatly improve your site’s performance and speed). Sign-up here and let them supercharge your website in 5 minutes or less. You just need to change your nameserver to use Cloudflare.

Check your site in GTmetrix.com after you did the following steps, or enter just your domain URL below and hit Check my site on GTMetrix!:

That’s it! Detailed instructions in using Cloudflare, Google PSS, and other website speed boosters / content delivery networks will be on my next post.