We all have worked on multiple projects and have delivered multiple applications to Production, but one of the Common Issues that surfaces everytime irrespective of the technology used in the application is “The site is very slow”. This actually boils down to the latency and response time for loading the UI.
Even though some of the complex integrations, with external/legacy systems, workflows, business rules, database queries, customization of the screens and many more…have been incorporated in a project, the one single thing that can stump the customer or the end user is the page-load time.
Lets, forget about the project, even in our day-to-day life, we get irritated and pissed-off when the Banking Transaction or the Gateway Payment is slow – we just burst out. For any page we browse, if it takes, more than 4-5 seconds, we just move-on to some other link.
The best example to site here is : What is the link you enter in your browser to check if the network connectivity or wireless is ON. Have seen most of the people including myself hitting the url with – http://www.google.com. But Why??… The simple and straight forward answer is, it loads very very faster than other pages(agreed it can be debatable considering that the Google homepage just has a few lines texts)
So, the bottom line is, to please the end user and give him/her a better experience, its is very important to concentrate on the page-load time and the steps to improvize upon it.
My earlier blog post showcases an infographic (by GTMetrix.com) about “How much time is wasted in Loading Web Pages“. This is something that cannot be ruled out or kept aside.
This brings us to an interesting question How??
Living in an era of high end technology and Open-Source Softwares, things may not have to be built from scratch. Here are a few tools and examples of the engineering tools that can be leveraged for identifying/debugging the loopholes and providing a lightening speed user experience.
1) YSlow :
- YSlow is a tool that helps you to speed up your website.
- It is an add-on for Firefox—or rather, an add-on to an add-on (Firebug).
- This is developed by the Yahoo Exceptional Performance Team
- It is built on 34 basic rules that affect a web page performance and slowness
- The details of these rules can be browsed from the like - http://yslow.org/.
- It Grades the web page based on one of three predefined ruleset or a user-defined ruleset
- It provides suggestions for improving the page’s performance
- Summarizes the page’s components
- Displays statistics about the page
- FAQs on YSlow - http://yslow.org/faq/
Here are a few pointers, if breached may be the responsible for slowing down your webpage-loading :
- CSS references should always be placed on top of a web page
- The Java Scripts should be placed at the bottom of the page
- Compressing the components with GZip
- Expensive errors like HTTP 404 should be avoided as it degrades the end user exp.
- Using a centralized content delivery network (CDN) for storing static images and documents for referencing in the web pages
- ..many more (from the Yahoo’s list of Rules)
At some point of time one curious question might arise, “my application has a performance score of 100% but still it’s very slow. Why?” Well then obviously it’s time for you to sit back and start optimizing your business logic and entire solution implementation. Remember “Yahoo’s problems aren’t necessarily your problem”.
Interesing Regerences :
Snapshot :
2) GTMetrix.com
- Its is a free speed analysis tool for websites!
- Logon to GTMetrix.com (signup for better tracking of results)
- Enter the URL of the page/site you want to monitor and click submit
- It gives a Report (PDF), with detailed information on the Page Speed and reason for slowness of the system
- It is integrated with YSlow at the backend, and provides a Grading from the Page Speed perspective and YSlow perspective
- With advanced options even the testing hub or location can be selected (if the application is globally accessed by customers)
- Filmstrip capture can also be generated to showcase after how many seconds the page gets loaded, or what all portions of the page get loaded every second
Interesting Read :
- Why is my page slow? (Detailed architecture and description for slowness of a web page)
- GTMetrix faqs – nice read
-
How to Use GTMetrix Plugin to Improve WordPress Site Performance
Snapshots:
3) Google’s Page Speed Insights
- The PageSpeed family of tools is designed to help you optimize the performance of your website.
- PageSpeed Insights products will help you identify performance best practices that can be applied to your site, and PageSpeed optimization tools can help you automate the process.
- Download plugin Page Speed Insights(by Google) from Chrome Web Store
Interesting Read:
Snapshots:
Other links for Testing the webpage speed :
Reference and Nice Read :
- Site Optimization Tutorial
- Image Source : http://www.freedigitalphotos.net
Please do sugegst and share if you come across any interesting link or tool for boosing a website!! 
PS: The examples of the sites referred in this blog are just examples, and has nothing to point out or compare which site performs better
Happy Speeding!!
