This week we will talk about a quick and easy way to optimize your code by removing spaces. If you know it or not but those spaces and enters in your code can increase your code size up to 20%. If you were to remove all those unwanted spaces in the code your site would still look the same but load faster.
Here is an example of what most sites html code looks like…
<HTML>
<HEAD>
<TITLE>Hello, World Page!</TITLE>
</HEAD>
<BODY>
Hello, World!
</BODY>
</HTML>
Here is what it would look like optimized…
<HTML> <HEAD> <TITLE>Hello, World Page!</TITLE> </HEAD>Â <BODY> Hello, World! </BODY> </HTML>Â
To do that you could manually go through and clean up your code. I believe that both FrontPage and Dreamweaver both have a clean up code ability built into them. You can read the help files of those software’s to determine how to do it. For those that like to do it free online I found this free code optimizer script. You paste your code into the page and click Optimize. This will clean up the code for you. Note that it does add a site optimized by tag which you can of course remove.
Do you optimize your code? If so how do you do it?
Matt
August 9, 2008 6:01 pm
I never optimize my (X)HTML, but I do optimize and compress my CSS and JS files. I use CleanCSS for CSS, and Packer for JS.
Tony
August 13, 2008 12:19 am
I didn’t think parsers really cared much about the spaces between x/html tags. But I guess the eye-pleasing whitespace does add to the overall bytecount. It almost makes more sense to use PHP’s output buffering to store the whole page, then strip the whitespace from between the end of one tag and the beginning of another… but then all your tags must conform to a set hierarchy.
Hm… with broadband internet speeds widely available, does all that whitespace really matter, if it doesn’t affect the rendering?
-Tony
blogadmin
August 13, 2008 5:10 am
I would think it would because shrinking can reduce 20% of the file size which means faster downloads.