Web page Optimization

Question

I'm creating a new dinamic site to test and learn about web optimization... Site Index

For html,css,js (exept jquery-min that is linked to google server) files I've created a php file that concatenate more files, remove unused spaces, and compress it using Gzip: compressed css - compressed js

if(extension_loaded('zlib')){ob_start('ob_gzhandler');
/*...php code to read files and remove comments/spaces*/
if(extension_loaded('zlib')){ob_end_flush();}

For main images, I collapsed every image into one

For facebook like button, I replace the iframe after page load using jquery, I'd like to do the same with adbrite advertises but I don't know how.. If I try to replace, or inject the code into html after loading, the page disapper and remain only the adv...

Someone could help?

Can you tell me if I'm doing well (for optimization) and where I can improve

Thanks...

Answer 1

It's a good start, but you shouldn't compress anything dynamically. That is just too costly and will end up to be slower than delivering content uncompressed.

Use gzip/deflate and compress your javascript files with a minifier like YUI, Google's closure compiler or uglifyjs to name a few. Serve those files statical.

A nice tool to automate all of the above processes (and way more..) is Apache ANT.

A nice library to serve any content dynamically over one stream is supplyJS.

Answer 2

You can also try Google Granule: http://code.google.com/p/granule/ (which programmatically compresses and minifies css files and js files on the fly)

Also check your "adbrite advertises" is not working is because the code might be using a Document.write() method, which should be called while the document is being parsed. try loading them asynchronously or deferred.

http://www.sitepoint.com/non-blocking-async-defer/