This article outlines how to test performance in Vizlib apps. It can be used to check how long extensions take to load and also highlight anything which may affect load time. A recorded profile of your testing of your performance and load times will help us to analyze any reported performance issues.
TABLE OF CONTENTS
Note: The article uses Google Chrome, but is written to be used with any web browser. You may find there will be slight visual differences if you're using another browser.
Open the web page you need to analyze.
Press F12 (or Ctrl + Shift + I) to open DevTools (Figure 1).
Figure 1: DevTools
Click the Performance tab in DevTools. If you don’t find it simply click the two arrows “>>“ to get it among the list of options (Figure 2).
Figure 2: Performance Tab
Performance Tab Options
- Choose the Start Profiling and reload page option (Figure 3) which usually looks like a refresh button.
Figure 3: Start Profiling and reload page
- When you select Start Profiling and reload page, this will refresh your page and start profiling. (Figure 4). You will see the red recording light switch on and the status will be set as Profiling.
Figure 4: Profiling
- If Vizlib Support has asked for this profile, you can save it by Right-clicking anywhere on the profile (Figure 5), selecting Save profile and send it to Vizlib to share the output.
Figure 5: Save profile
Note: If the file is too large to email, you can send it to Vizlib using our upload portal here.
To analyse the results yourself, use your mouse scroll button to look through the profile. You can investigate load times and any blockers to loading, or even focus on time frame by clicking and moving your mouse. The video in Figure 6 demonstrates all these processes.
Figure 6: Analysis
The profile is split into processes. displaying the network, animations, and interactions that occur for the sheet to load. Clicking on each showcase, you can learn about the process type (e.g. script or network API), and the processes which run before and after.