[METHOD] How To Optimize Your Page Speed ?

I thought I had my page load skills down with my sprites and minified code; apparently not.

Mad props for this, some really good information!! - Rep + Thanks given.
 
I am running an online shop on the Magento platform. I have spent the last few days getting the page speeds down. It has taken a while but i now confident in saying that the site is running at a very fast speed and i have already seen a nice increase in conversions.

Here are some of the things i used:

1. Get firebug for firefox and use the YSlow tool and Google Page Speed tools. This will cover all the basics of speeding up your website including gzip-ing, cache management and smushing those images!

Just by gzip-ing the homepage, i saved 85%! This makes a very noticeable difference. Ensuring that your .htaccess is nicely configured saw an immediate change in speed using mod_deflate or zlib.output_compression.

2. I moved the site to a dedicated server (just about ready anyway) and the benefits have been huge for page speeds. The server is also now in the country where 95% of my customers are based which has seen the initial page rendering quicken.

3. Spread the images, js and media over 3 parallel sub-domains - e.g image.domain.com, js.domain.com, etc. Whilst not a hugely noticeable difference to me, it has given the site a nice speed boost. This was a breeze to set up with Magento.

4. Implemented an extension that combines all the CSS and JS files into one and minis them. This again....reduced the file sizes and decreased page times immensely!

5. Went to MySQL Admin and selected all the tables and repaired them and then optimized them!

Just by doing these 5 things, the site is running much smoother.
 
ABYSEE:
6) Another thing i don't do because i go quite often in the code of my website, but you can remove the blank space of every file of your website, it will reduce the size of your pages by 10-25% according the lenght. You could do it for CSS code too.


What you mean by that? You mean to remove all these blank spaces between code in the files?

The rest of things I am doing on autopilot when setting up new site :)
 
Thanks a ton, dude! Knew some of the pointers, but definately not all of them. Very nice work, will get back to you with the results. Rep given.
 
Thanks for these, i've added these to my site and it's not 97 out of a 100 on google speed checker.
 
ABYSEE:
6) Another thing i don't do because i go quite often in the code of my website, but you can remove the blank space of every file of your website, it will reduce the size of your pages by 10-25% according the lenght. You could do it for CSS code too.


What you mean by that? You mean to remove all these blank spaces between code in the files?

The rest of things I am doing on autopilot when setting up new site :)

Yep exactly, it is about any broken line or blank.
But once again the code will be hardly readable, so you have to keep an expanded backup.
 
This was one of the most helpful posts I read on here. Thank you, man!
 
Got around implementing the .htaccess part today and I now score 100/100 :)

Once more thank you, Abysse, you are one cool guy! :)
 
the htaccess part, put it in your apache config.. its quicker there than htaccess, + you can easily apply to all domains.. thats if u use a dedicated server of course :)
 
Hey Guys,

Today, i'm going to cover a critical aspect of on page SEO. Hang On it will be long and not necessary exhaustive.

Page Speed is very important for 2 reasons :

- It helps Google to crawl further your website which is good for indexing of course
- It reduces your bounce rate or worse your pogosticking as your website is loading very slowly.

NB : Pogosticking = when a user goes to your website, goes back, picks another website and stay at your competitor. G. Panda take it as a factor of quality and you can now get outranked because of it.


Here are the tips :


1) The first thing to do is to used a golden tool which is the google page speed plugin :



For firefox users you have to use a plugin named firebug which is just great !

Once you have set it up properly, run a page speed test on your website. And try to match the orange, and red spot titles with this how to.


2) Enable Gzip if your web hosting provider allows it. Add this line at the top of your websites :


PHP:
<?php if (substr_count($_SERVER['HTTP_ACCEPT_ENCODING'], 'gzip')) ob_start("ob_gzhandler"); else ob_start(); ?>
Then you can check if it is enabled here :




3) Compress your images. This is easy a bit boring but it increases drastically your loading time.

For that you can use either photoshop, The Gimp (free) or what i use personnally as i find it convenient the Google Page Speed plugin itself.
As it is showing you which images are optimized and which are not and allow to compress them with the save as button.

4) Open / Create a .htaccess file and place this code :



This will litteraly do some magic. If you have problem with the Gzip code stated above you can paste the full content. If you don't have problem with it you can remove this :



5) Place your javascript ressources at the bottom of your page. Personnally i don't do it, as i like to have my header with everything in it. But it will definitly help

6) Another thing i don't do because i go quite often in the code of my website, but you can remove the blank space of every file of your website, it will reduce the size of your pages by 10-25% according the lenght. You could do it for CSS code too.

7) Optimize your SQL databases the more often you can according to your traffic, through PHPmyadmin or through your CMS. This will bring you a light improvement and prevent you for unexpected crash.

Wordpress Users :

1) If you use wordpress you have to use a caching plugin like supercache or hypercache, it will drastically help with your loading time. You can earn something like 800% of your loading time with such a plugin according to some benchmarks :

Here is the place to find Super Cache :




To Go Further :

To be honest i don't do these as it is time killing when you have a website already and it makes you earn between 2 and 5 points in G speed :

1) Use CSS Sprites : The concept is to merge all your website's structural images into 1 mockup, then use the CSS to place the others elements into your mockup.
2) Use External Subdomain to load your external ressources (Javascript for exemple). It will allow you to use the speed of 2 servers instead of 1 to load your content


I believe there are others criterias i may have omitted but this is a good basis to drastically increase your loading time. It is an open thread, so go ahead with your own methods.
That was really informative and helpful post buddy. Thanks for sharing and keep it up for more like these.
:)
 
The geographic location of the server also determines site's speed. If you're targeting traffic from certain countries, move your web host closer to them. But monitor too, as bandwidth pipes vary.

Test by pinging from various ISPs to the server to see which are the best. Last time I moved my VPS from West Coast to Asia Pacific, the turnaround time was sliced in more than half.
 
Awesome info that you have shared with us. It will be sure to come in handy.
 
Back
Top