Performance (speed) of a Website
Performance of a website or we can say increasing speed of a website depends on various pin points, these points must be taken into consideration to increase performance of a website. The performance or we can say speed of a website is not completely achieved by optimized backend
only i.e.database side end, it is also achieved by optimizing front end.
The front end optimization includes
- Minimizing Round Trip Times
- Minimizing Number of Redirects
- Avoiding all Bad Requests
- Having Less Number of JS, CSS, Image Files etc Attached
- Having Compressed Webpage, JS, CSS etc
- Keeping Right Placement of Components
- Less Number of DNS Look Ups
- Caching of Components
- Combining of Images
- Other Tit Bits of Increasing Performance of Website
Minimizing Round Trip Times
The Round Trip time is the time that a client takes to initialize a request till response which does not include data transfer time or download time. Before a client is connected with server it has to pass with some stages i.e.at first it has to resolve DNS, means it has to find out IP address of the server to make a connection, if IP address is not found on client side then it has to find it out on ISP side, Once this process is completed, it has to set up TCP connection and then requesting and respondingback.
So the thing is clear that the less number of http requests we have on our page the better performance we will achieve. If any of the components are referenced that are found on other server as usually components are referenced that are found on subdomains then a new DNS look up overhead increases.
Minimizing Number of Redirects
Requesting a resource and then the same resource redirects to a new resource, obviously degrades the performance by increasing response time. Requesting a resource by completing its cycle and then redirects to new location has to complete another cycle leads to double response time. It would be more performance degradation if the new resource is found on another domain rather than on the same domain on which referee reside.
Avoiding all Bad Requests
You are requesting a resource that actually does not respond with 200 response code, the resource may have been removed to new location or it is no where found or there can be various cases with it. So requesting such resource which does not response well degrades performance. This is not the case only with a webpage, the same thing can happen with your images, CSS, JS etc where ever your make a reference.
Having Less Number of JS, CSS, Image Files etc Attached
When a browser makes a request to a webpage, it has to complete the whole cycle (mentioned above) to get response and download the content, In the content it finds number of JS, CSS files attached, it stops processing and gets back to generate a new cycle to download these files attached as it goes on in parsing the webpage content, it finds resources and initiates request to them and downloads, so it is obvious if there are more number of CSS, JS, images, iframes, flash files etc attached the more time will be taken because all browsers do not support parallel processing, so it becomes clear that if we put all JS content in one file and all CSS content in one file it would significantly improve performance to a greater extent.
Having Compressed Webpage, JS, CSS etc
The Compression of files by gzip or deflate reduces size to 40 to 80 percent. Almost all well known browsers support compression and decompression by gzip and deflate. It reduces network burden and bandwidth and enhances response time so leads to achieve good performance of a website in terms of speed and user experience. The less the content is the more quickly it is transferred, executed and parsed.
Keeping Right Placement of Components
As we already discussed above that while parsing the content when a resource link like href src is found, the control is transferred to download it and other parsing haults till download completes, so it is clear here if javascript files attached references are found in head section of a webpage the performance degrades to it extent, it would be foam to the fire if we put these javascript files after body closing tag and CSS within head section.
Less Number of DNS Look Ups
Mentioned above in various topics how to minimize DNS Look Up overhead.
Caching of Components
How effective it would be in terms of performance of a website if while parsing the webpage the attached resources like JS, CSS, Images etc are not downloaded every time the page is requested. It will Dramatically Improve Performance of your website in terms of speed and user experience. It is possible by mentioning expiry date in headers of that resource, how long you want the resource to be in cache. it can be down through your coding and can also be done on server level, go to http headers section and set the expiry date of component.
Combining of Images
There are number of images on every webpage of a website, and each image is downloaded separately, to download all images at a time we need to combine these images through CSS sprites. This Technique will minimize round trip time, Minimize delays in downloading other required resources and Minimize request overhead.
Other Tit Bits of Increasing Performance of Website
1. Avoid using larger view states.
2. Session or cookies in pre login pages to track users or other purposes.
3. Avoid table based design.
4. Avoid using CSS images and CSS Imports.
5. Avoid Document.write
6. don't Scale Images.
7. Avoid Using of iframes and empty src and href.
8. don't Mingle up CSS files in JS Files and vice versa.
9. Avoid CSS Expressions.
10. Remove Commented Texts, Spaces
11. Minimize your CSS and HTML by various means like short class names, id, path etc