I decided to write a different topic article, about performance techniques, just to keep things interesting. So this article will not be about jQuery especially but a general tutorial about how to improve your web site performance ( a thing that I found is very important). I will try to make a list will all the best practices when it comes to web page optimization.
1.Minify javascript and css
The performance of a web page can be increased if the javascript and css is compressed.When code is minified comments are removed, white spaces, and in case of javascript a base64_encode can also be used.The resulting file will decrease in size. Tools that can be used are JSMin and YUI Compressor.Also a lot of free tools can be found on the internet.These is how a compressed js code will look like:
-
eval(function(p,a,c,k,e,r){e=String;if(!''.replace(/^/,String)){while(c–)r[c]=k[c]||c;k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c–)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('1 2(3,0){4("5.6 = 7;",0)}',8,8,'b|function|timedRedirect|a|setTimeout|location|href|redirectTo'.split('|'),0,{}))
2. Flush the head
When a request is made, the browser has to wait for the html content to be received from the server before it can start retriving js files, css files , images, etc. So a good practice is to flush the head part of the html before so the browser can start retrieving the js,css files.
-
-
< ?php flush(); ?>
-
<body>
-
</body>
3. Split Components Across Domains
By splitting you can maximize parallel downloads. By standard a browser will not make more then 2 request at a time, so if you have 10 images on a page it will get the first 2, then the next 2 and so on.By splitting on multiple domains you will resolve this issue. Make sure you’re using not more than 2-4 domains because of the DNS lookup penalty. As an example, you can host your main html/dynamic content on www.using-jquery.com and move static components(images,css files, js files) on static1.using-jquery.com and static2.using-jquery.com
Read more