Frontend performance: Important to care about?
Graphic credit: linkedin.com
Speed is the most important feature of any online store. If the speed is too slow, people will just not use the site, doesn’t matter it has great products ,low prices, the most beautiful interface, but if it takes forever to load, people will just go away. In the offline world, we often have to wait. Line in the bank, security control at the airport, checkout line at the grocery store etc. "I had such a great time waiting in the line for 3 hours" – no one ever said as people just hate waiting.
On the other hand, in the online world, we have ability to serve thousands of customers at the same time. And that's exactly what people expect. They expect websites to load in 2 seconds or less. Almost half of customers will abandon the website if it takes more than 3 seconds to load, and most of them will never come back. (Source: Kissmetrics)
Bad performance = Bad business
We all know that loading time has direct impact on customer satisfaction, conversions, and in the bottom line, on sales. It is proven that 1 second delay in loading time results in 7% less conversions. Amazon discovered that 100ms of latency costs them 1% less revenue. On the other hand, statistics show that websites are getting slower every year. It is almost like they are losing money on purpose. Why is that?
Graphic credit: radware.com
Websites are getting fatter
Websites are getting more complex every year. We also have bigger screens and bigger images, and that is the main reason why web pages are getting “fatter”. Namely, around 60% of page weight consists of images.
Speed is a feature, treat it as a part of UX
Speed is directly responsible for conversion rates. It is your competitive advantage. A feature of your store and it is equally or even more important than your fancy newsletter subscribe form or one-step checkout. If your website is slow, no one will use it.
Treat performance as a part of UX design, plan it in advance and make sure to secure a budget for it. Speed is the most important feature. If your application is slow, people won't use it. I see this more with mainstream users than I do with power users. I think that power users sometimes have a bit of sympathetic eye to the challenges of building really fast web apps, and maybe they're willing to live with it, but when I look at my wife and kids, they're my mainstream view of the world. If something is slow, they're just gone.
Fred Wilson: "The 10 Golden Principles of Successful Web Apps"
Set a performance budget
We are not talking about money here. Performance budget is a clever idea introduced by Tim Kadlec.
A performance budget is just what it sounds like: you set a “budget” on your page and do not allow the page to exceed that.
Your “budget” may be number of requests, page weight, loading time etc. It is important to declare your goals early in the planning phase. If you set a goal to have a homepage under 500Kb and then design a content slider with 5 full screen images, it is going to be impossible to achieve your goal.
Once you achieved your goals, you should stick to them. Next time you want to add something to the page, you need to make sure it doesn’t exceed the budget. If it is does, there are three options:
- Optimize an existing feature or asset on the page.
- Remove an existing feature or asset from the page.
- Don’t add the new feature or asset.
This is the part you need to be religious about it. Squeeze the last Kb out of your website. The main goals of optimization are:
- Reduce http requests
- Reduce file sizes
- Reduce latency
- Optimize critical rendering path
There are numerous techniques to achieve these goals and we will cover them in our future blog posts. Stay tuned! We provide services to analyze your site and find the speed issues.
For more detail you can contact at http://www.dotsquares.com/
Article courtesy http://inchoo.net