Application performance can be defined in terms of response time ( How fast the application responds under peak load), resource usage (How many resources viz. CPU, memory, network the application use), and consistency (Does the application behave consistently over time, across browsers). An average user has no patience for websites or web application that takes too long to load. According to a study by Kissmetrics, a 0.1-second delay in the page load time of an application will cause a 7% loss in conversions, an 11% decrease in page visits, and a 16% decrease in customer satisfaction. In dollar terms, this means that if the site typically earns $100,000 a day, this year it could lose $2.5 million in sales. Similarly, a study by FastCompany shows that an increase of every 0.1-second load time of Amazon decreases its sales by 1%, and increasing page load time from 0.4 seconds to 0.9 seconds in Google decreases its traffic and ad revenues by 20%.
A better and fast-performing site or application will have a better user experience, repeat site visits, will be indexed faster by search engines, and appear on top of SERPs which in turn leads to increased revenue. Several factors can affect application performance, but some of the most common ones are:
- Rich and interactive UI with too many plugins, images, or animations, application complexity, technology & framework, data handling mechanism, number of concurrent users, etc.
- The poorly optimized code causes potential bugs, performance & security issues, code complexity, and technical debts.
- Inefficient database design affects the application in production
- Incorrect and insufficient environment configuration while hosting
Steps to Improve Web Application Performance
Here we have categorized the steps for improving web application performance into 4 sections – 1)Application Design Optimization 2) Application UI Optimization 3) Database Optimization 4) General Recommendations
1. Application Design Optimizations
- Technology & Framework – Choose technology and framework that is appropriate for your application functionality.
- No concurrent users – If there are concurrent users using the application, the third-party controls chosen should be able to handle the load, else it can cause a performance issue.
- Data Handling Mechanism – Use proper DB, caching, etc. to make data loading on demand and on mobiles display required data only.
- Hosting Server – Check for the deployment environment, load balancer, and database partitioning, and use orchestration tools.
- Optimized code – Always do manual code review, peer review & automated code review. Avoid writing unwanted loops, use serialization techniques, make use of asynchronous calls, use service brokers in SQL, use reusable code, and use JavaScript appropriately.
2. Application UI Optimizations
- Simple and Lightweight – Make the application simple and lightweight by streamlining the number of elements on the page, using partial rendering, merging all JS & CSS, and minifying using YUI compressor, codekit, or JavaScript minifier. This will improve the page speed.
- Optimize images – Keep the images of the application as small as possible since oversized images take longer to load. Crop the images to the correct size, reduce color, and remove comments from images.
- Enable Caching – Enabling the browser cache is crucial for the application since it will store the page visited and next time will load the page without sending another HTTP request to the server.
3. Database Optimization
- Rewrite the queries – Rewrite the queries using looping queries, picking only needed columns and filtering rows correctly, and using indexes. Also, can use ORM tools.
- Change indexing strategy – Change the indexing strategy if a non-selective index has been picked while execution and use index hints.
- Use an external cache – Use of an external cache can reduce the database load.
4. General Recommendations
- Monitor & maintain page performance, web application speed, application performance management, etc. using various tools.
- Use partial-page-rendering.
- Minimize the amount of data requested per request
- Maximizing the usage of client-side components wherever possible
- Avoid 3rd party plugins unless absolutely required.
- Keep the 3rd party scripts at the bottom of the page and load on demand
- Encourage usage of CSS scripts
- Avoid iframes and redirects to the best extent possible
- Introduce caching at the server-side, database layer, and other possible integration layers
- Conduct usability studies and understand the expectations of end-user
