Forum Moderators: phranque
[edited by: eelixduppy at 5:39 am (utc) on April 30, 2009]
[edit reason] no personal URLs, please [/edit]
So, you have to check some good books that deal with optimisation.
Just one variable like javascript and CSS file moved to external file will increase speed. Check first this. Than check all images size.
Start with what is being output to the browser.
How many images? What is the total size of the web page? Use one of the many free page optimization services out there to put a number to this.
Although 40K is still the "recommended page size" it's hardly realistic for most web sites. If you can get your total page size under 100K including all images and included files (CSS, JS) you're doing pretty good.
How many requests to the server? When you load a page, that's one server request. Every image or other resource in the page is another request to the server (ex: <img src="go_get_image.jpg.">) If you have say, images that are "spliced" together, see if you can lay them out in a way so that they are now one image. Apply throughout, reducing server requests.
Validate your code [validator.w3.org]. Clean it up, removing all inline garbage
<font face="arial,helvetica,sans-serif">Boo</font>
To CSS
.scary { font-family:arial,helvetica,sans-serif; }
<span class="scary">Boo</span>
or external JS
<a href="image" id="myimage" onClick="return some_action();">
to
window.onload= function() { document.getElementById('myimage').onclick=function() { return some_function(); }; };
<a href="image" id="myimage">
If you use a WYSIWYG editor (DreamWeaver, Front PAge/Expressions, etc.) These are notorious for leaving "empty elements"
<font size="2"></font><span style="color:red"></span><span style="color:blue">Oh HERE I am!</span>
Eliminate them. Also eliminate nested crapola; often I see
<span style="color:red"><span style="font-size:24px"><span style="font-style:italic">Big Red Italic</span></span></span>
instead,
<span style="color:red;font-size:24px";font-style:italic">Big Red Italic</span>
Or best of all, external style sheet:
.big-red-italic { color:red;font-size:24px;font-style:italic; }
.....
<span class="big-red-italic">Big Red Italic</span>
If you have tabled layouts, try to convert them to table-less. On a large page, the entire table has to render, top to bottom, before anything displays, while most table-less layouts will render top to bottom.
Of course, optimize all your images. Take a sample image, save it in JPG and .GIF. What produces the smaller file size? Experiment with the color depth of .gif, it can go from 8 bits color to 256, with increasing sizes. How much can you trim without losing major image quality? Don't batch mode your images, look at each one by one. It's not uncommon in, say, a series of navigation images to save one at 8 bit color and the next at 16 to maintain quality but reduce the file size by a few k. Don't be afraid to give up a *little* quality; a navigation image is not as critical as a product image. "But I want everything to be highest quality" - don't let your ego get in the way! :-)
Related, are there any images you have as images only because you want some particular font? Your need for "appearance" is nowhere near as important as getting the message through; if you have these, give up a little working room and use them as plain text. Search engines will like this better anyway.
PHP: Just how well, and accurate, does your PHP execute? Is this a weak link, with sloppy or excessive work being done? Look at some of the optimization tools in PHP, like the get_memory_usage() [us.php.net] function, drop some benchmarks throughout the code. If it's taking more than a few seconds to do it's work, you have a weak link there.
So now you've done your homework, cleaned up everything you can on the site, look at your host. Shared hosting? Move. Don't even question it, just do it. Don't pick another shared host, one may not be any better than another. Take a serious look at VPS/VDS solutions, they are not that expensive. If your site is turning a profit or has potential to, you can't afford not to crack the wallet on this one. IF you're moving from shared to a VPS or dedicated server, the difference will by light years and you'll be kicking yourself for not doing it sooner.
[edited by: phranque at 10:25 pm (utc) on April 30, 2009]
[edit reason] disabled graphic smileys ;) [/edit]
This plugin rates site pages based on their access speed and gives hints how to improve performance. This tool mainly detects performance issues in the communication between the website and the visitor, i.e. many images, redundant calls to script files etc. It doesn't catch performance problems inside your PHP code.
