UI-Performance Optimization by Identifying its Bottlenecks Akshita Aggarwal Software Developer Co – Author - Deepak Khatri Sr. Test Architect NIIT Technologies

ABSTRACT More and more complexity on the front-end leads to delay. Client side performance issues have direct impact on user experience. So, finding out and resolving all client-side web application’s performance issues are of utmost importance for good user experience. PURPOSE This paper will bring easiness to a tester, with approach to identify potential problematic areas & bottlenecks. How he can find out better and refined solution. How a framework can be built on top of available open sources API to obtain simple and understandable reports.  

Need of UI Performance Optimization How long will I have to wait? Pages should not only load quickly, but also run well. Role of rendering time is equally important. Design a framework that captures rendering time.  Client expects response to be in less than 100 ms.

Selenium Stand Alone Server Architecture Test Scripts Web Browser Proxy Web Driver Analyzer Reports/ Graphs Selenium Stand Alone Server TOOL

Working Execute Output Selenium Scripts Make the selection for further details For Export (csv format) Design Tool Tester

Key Features HTTP traffic (response and render time)capture and modification Efficient for troubleshooting, performance turning Requires less user time and easy to understand.    Support for any client web Application Automatic Selenium Scripts Export summarized data for further usage   

Demonstration

Conclusion This tool can identify slow requests , bottlenecks where requests are blocked and their root cause. It can be configured separately in the target environment and is well suited for test scripts. Testers are benefitted as no overhead is required. Hence it is advisable to profile your web page to find components that you don’t need or components that can be optimized.

References & Appendix Little Proxy-free utility to watch and manipulate network traffic Chrome dev tools for analyzing runtime performance MSDN-web debugger tool Google web developers for rendering performance Author Biography Total 6 months+ of IT experience. Software developer with NIIT Technologies. Qualification: PG Degree (MCA). Skilled knowledge and expertise in current computer hardware and software, Performance Testing & Engineering, Automation and few open sources. Q n A