RBU Profiling – Overview
Runtime performance is the measurement of page performance when it is running, as opposed to loading. This document provides a brief description about how Cavisson NetStorm can help to analyze runtime performance of the page(s) of an application when it is running.
Configuration for RBU Profiling
Follow the below mentioned steps for the configuration of RBU profiling in NetStorm Scenario:
- Login to NetStorm and navigate to Scenarios section.
2. Select a scenario from the list of available scenarios.
3. Go to Real Browser User Settings section and select the Run virtual user as real browser user check box. Then expand JS Profiler Settings.
- To analyze the page performance results, select the Enable JSProfiler (Supported only for Chrome Browser) check box. JS Profiler is supported for Chrome version 68 and above. Therefore, if the Chrome browser selected earlier is lower than version 68, an error message is displayed.
5. Further, user can specify the timeout for saving the JS Profiler data. This rage is between 10-60 seconds.
6. To collect page screenshot and observe how the page was evolving during downloading, select the Capture Screenshot check box.
7. Save the JS Profiler configurations by clicking the Save icon () at the top-left section of the window.
Analyzing the Results
Once JS Profiler configurations are done, the user can observe the page performance and can analyze the results. To do this, follow the below mentioned steps:
- Navigate to NetStorm – Home page, then go to Test Run window, select the test for which the page performance is to be analyzed, and click the Reports button.
2. This displays the Reports window. Go to Ready Reports and click the Page Detail report.
3. This displays the Page Detail Reports Click the icon to view JS profiler.
Once the recording of the page’s performance is generated, the user can measure how poor the page’s performance is, and find the cause(s).
- Click the Performance tab at the top-left of the window.
This window contains various sections to analyze the page performance:
Analyze frames per second
The main metric for measuring the performance of any animation is frames per second (FPS).
Red bar above FPS indicates that the framerate dropped so low that it is probably harming the user experience. In general, the higher the green bar, the higher the FPS.
Below the FPS chart, the user can see the CPU chart. When the CPU chart is full of colors it means CPU is highly utilized during recording and we should find ways to minimize the CPU utilization for its optimization.
The colors in the CPU chart correspond to the colors in the Summary tab, at the bottom of the Performance panel.
- Hover the mouse over the FPS, CPU, or NET charts. NetStorm displays a screenshot of the page at that point in time. Move the mouse left and right to replay the recording. This is called scrubbing, and it is useful for manually analyzing the progression of animations.
6. In the Frames section, hover the mouse over one of the green squares. NetStorm displays the FPS for that particular frame.
7. Similarly, user can view the Network stats, Interactions, and Timings.
8. To view memory timelines, select the Memory check box.
9. Expand the Main section to see which URL is passing. NetStorm displays a flame chart of activity on the main thread, over time. The x-axis represents the recording, over time. Each bar represents an event. A wider bar means that event took longer. The y-axis represents the call stack. When the user see events stacked on top of each other, it means the upper events caused the lower events.
There is a lot of data in the recording. Zoom in on a single Animation Frame Fired event by clicking, holding, and dragging the mouse over the Overview, which is the section that includes the FPS, CPU, and NET charts. The Main section and Summary tab only display information for the selected portion of the recording.
Note: Red triangle at the top-right of the Animation Frame Fired event indicates a warning that there may be an issue related to this event.
- Click the Bottom-Up tab to see how the calls are recorded.
11. Click Call Tree tab to see the execution of the calls.
12. Click Event Log to see the logged events during the execution of the page.