Following are the points should be taken into account while checking the performance of the site:
• Remove bad request to the server.
• Minify HTML
• Minify CSS
• Combine images using CSS sprites.
• Avoid Inline Css
• Optimize Images
• Specify Image dimensions
• Leverage browser caching
• Minimize redirects.
• Avoid HTTP request
Remove bad request to the server:
Avoid unwanted or bad request to the server. This means requesting for the files that are not available in the server.
Minimize the lines of code in CSS. Remove the unwanted and commented code in it.
Minimize the lines of code in HTML. Remove the unwanted and commented code in it.
Combine images using CSS sprites:
Combine all the images and place it as singe image and positioning the images needed in the CSS use it for the website. It may decrease number of request made to the site.
Avoid Inline CSS:
We should not use inline styles so that it decrease the performance.
Specify Image Dimensions:
For image source, need to add width, height attribute.
Reduce the number of redirects in the site. Unwanted redirect may affect the site performance.
Avoid HTTP Request:
Adding HTTP request within the site is not recommended. Sometimes if the request URL is not working then it will affect our sites performance.
Leverage Browser caching:
Add the below code to enable browser cache: Under static content tag add the below code
Really a nice article. Lots of knowledge to improve the website performance. But just wanted to ask some doubts like-
1. Some times when you write css in a separate css file and inherit it in your webpage using reference of that css then it will work in some browser an not in others.
I have this issue, page is working fine in internet explorer but not in Google chrome. ANy solution for this. Till now i have used inline css for this. but this is not a good method.
write in the same page or in a different script page and use that as a reference.