In my last post I showed different approaches for load testing the server side. In this post I will highlight some tools I use to monitor the performance of the client side.
In modern Javascript-intensive web applications, users spend more time waiting on client-side rendering than the server-side processing. The reality is that as much effort that goes into optimizing the server-side, more effort should be made to optimize the client-side. End user monitoring has never been so important.
Why does performance matter?
Just to recap a few statistics about the business impact of performance at major internet companies:
- Amazon and Walmart increased revenue 1% for every 100ms of improvement
- Microsoft found that Bing searches that were 2 seconds slower resulted in a 4.3% drop in revenue per user
- When Mozilla shaved 2.2 seconds off their landing page, Firefox downloads increased 15.4% (60 million more downloads)
- Making Barack Obama’s website 60% faster increased donation conversions by 14% (30 million more dollars)
- Shopzilla sped up average page load time from 6 seconds to 1.2 seconds, and increased revenue by 12% and page views by 25%
As you iterate through the software development cycle it is important to measure application performance on both the server side and the client side and understand the impact of every release. Here are some tools you can use to test the performance of the entire end user experience:
Google PageSpeed Insights
Google PageSpeed Insights provides actionable advice for improving the performance of client-side web applications. PageSpeed Insights analyzes the content of a web page, then generates suggestions to make that page faster. Reducing page load times can reduce bounce rates and increase conversion rates. The service is available as part of the Google Chrome Developer Tools as an extension, a web service, and extensions for Apache and Nginx.
Use the Google PageSpeed Insight API to integrate client-side optimizations into your continuous integration setup.
curl "https://www.googleapis.com/pagespeedonline/v1/runPagespeed?url=http://dustinwhittle.com/&key=xxx"
WBench
WBench is a tool that uses the HTML5 navigation timing API to benchmark end user load times for websites.
1) Install WBench:
gem install wbench
2) Run WBench:
wbench http://dustinwhittle.com/
WebPageTest.org
WebPageTest.org enables anyone to test the client-side performance on a range of browsers from anywhere in the world for free. This service is great and worth every penny I didn’t pay for it. Not only does it provide a range of mobile/desktop browsers and locations, but it also shows a waterfall timeline and a video of the rendering.
AppDynamics
With AppDynamics Pro you get in-depth performance metrics to evaluate the scalability and performance of your application. Use the AppDynamics Pro Metrics Browser to track end user experience times and errors over the duration of the load tests:
With AppDynamics Pro End User Experience Dashboard you get visibility into both the server-side and the client-side:
Use AppDynamics Pro to compare multiple application releases to see the change in performance and stability:
In my next post in this series I will cover load testing tools for native mobile applications. Get started with AppDynamics Pro today for in-depth application performance management.
As always, please feel free to comment if you think I have missed something or if you have a request for content in an upcoming post.