Quantifying Performance
Learning Objectives
- You know of performance testing and stress testing.
- You know of the key metrics for assessing server-side and client-side performance.
Performance and load testing are both used to quantify the performance of a web application. Performance testing broadly focuses on the efficiency and responsiveness of the system, while load testing evaluates the system’s behavior under specific loads, including peak loads. Both types of testing are essential for understanding how a web application behaves in different scenarios and ensuring that it meets performance requirements.
Performance testing
When testing the performance of a system, both server-side and client-side performance should be considered. Server-side performance refers to the efficiency of the web server and backend systems, while client-side performance focuses on how efficiently the web application runs in the user’s browser. Good performance on both the client and the server is needed to deliver a good user experience.
Server-side performance
Server-side performance refers to the efficiency and responsiveness of the web server and backend systems that handle user requests, process data, and deliver content. Key metrics for assessing server-side performance include:
-
Response Time: The duration between a user’s request and the server’s response. Shorter response times lead to faster page loads and improved user satisfaction.
-
Throughput: The number of transactions or requests processed by the server within a specific time frame (e.g., requests per second). High throughput indicates the server can handle a large number of concurrent users effectively.
-
Latency: The delay before a transfer of data begins following an instruction for its transfer. Lower latency results in quicker data transmission, enhancing the responsiveness of applications.
-
Error Rates: The percentage of requests that result in errors (e.g., HTTP 5xx status codes). High error rates can indicate server instability or issues in the backend processes.
-
Resource Utilization: Measures the usage of server resources such as CPU, memory, disk I/O, and network usage. Efficient resource utilization ensures that servers operate smoothly without bottlenecks.
Client-side performance
Client-side performance refers to how efficiently a web application runs in the user’s browser. It directly impacts the user experience, influencing factors like page load speed, interactivity, and visual stability. A key piece for measuring client-side performance is Core Web Vitals, introduced by Google to provide standardized metrics that reflect user experience.
Core Web Vitals performance also influences application ranking in search engine results, making it crucial for search engine optimization.
Core Web Vitals consist of three primary metrics:
-
Largest Contentful Paint (LCP): Measures the time it takes for the largest content element to load within the viewport, indicating how quickly users perceive the main content to be loaded. LCP under 2.5 seconds is considered good.
-
Interaction to Next Paint (INP): Assesses interactivity by measuring the longest delay between a user’s interaction (e.g., click, tap) and the next frame paint during the entire page lifecycle, indicating the overall interactivity of the page. INP under 200 milliseconds is considered good.
-
Cumulative Layout Shift (CLS): Quantifies the visual stability by measuring the sum of all unexpected layout shifts that occur during the entire lifespan of the page, ensuring that content doesn’t move unexpectedly. CLS under 0.1 is considered good.
In addition, there are other metrics that contribute to a comprehensive understanding of client-side performance, such as First Contentful Paint (FCP), Time to Interactive (TTI), and Total Blocking Time (TBT). FCP measures the time when the first piece of content is rendered, TTI measures the time until the page is fully interactive, and TBT measures the total time between FCP and TTI where the main thread is blocked.
Load testing
Load testing evaluates how a web application behaves under expected and peak load conditions. It aims to identify the maximum operating capacity of an application and any bottlenecks that may prevent the application from performing at its required level.
There are three main methods for load testing: stress testing, peak testing, and soak testing. Stress testing is used to evaluate the system’s behavior under extreme conditions, such as high traffic loads or resource exhaustion. Peak testing assesses the system’s performance at the highest load the system is expected to handle. Soak testing involves running the system under a sustained load for an extended period to identify performance issues such as memory leaks or resource exhaustion that may arise over time.
The key objectives of load testing are as follows:
-
Determining the capacity of the system: Forming an understanding of how many users or requests the system can handle before performance degrades.
-
Identifying bottlenecks: Locating areas of the application that may cause performance issues under load, such as slow database queries, inefficient code, or limited server resources.
-
Validating performance requirements: Ensuring that the application meets performance requirements specified in service level agreements (SLAs) or performance targets.
Load testing is performed typically on the server-side application, using the common performance metrics for server-side performance such as response time, throughput, and error rates.
Relationship between Server-side and Client-side Performance
Server-side and client-side performance are interconnected and influence each other. For example, a slow server response time can delay the loading of resources on the client-side, impacting the overall user experience. Conversely, inefficient client-side code can lead to increased server load, resulting in slower response times.
Optimizing web application performance requires considering both server-side and client-side functionality. Improvements in server response times can enhance metrics like LCP, while efficient client-side code can reduce INP and CLS.
To understand the impact of changes to the application, it is essential to collect performance data from both the server and the client throughout the development process and the lifetime of the application. With comprehensive data, developers can quantify the impact of changes, identify bottlenecks, optimize performance, and ensure a smooth user experience.