Performance Mode
Performance Mode analyses the load time of assets within the system, presenting the results of these analyses on in-depth timeline charts.
Bookmarks to the headings on this page:
Users can employ this tool to monitor the performance of the assets within their system. Performance Mode is especially useful in locating problem areas or assets that may be causing excessive load times, allowing users to identify and resolve any performance issues.
Accessing Performance Mode
You can access Performance Mode by appending _performance to the URL of an asset, like so:
http://www.example.com/site/_performance
When Performance Mode is first accessed, Squiz Matrix will analyse the performance of the assets loaded on the URL. Once the performance of your asset has been analysed, the results of this analysis will be displayed at the bottom of your browser.
While all assets can be analysed in Performance Mode, only supported assets loaded on a URL will be displayed in the performance results. The following asset types are currently supported for detailed analysis in Performance Mode:
- Asset Builder Page *
- Asset Listing Page *
- Calendar Page
- Custom Form
- Data Source assets
- Design
- Paint Layout
- Remote Content
- Search Page (incl. Search Manager) *
- Standard Page
- Triggers
* Also supports individual asset step analysis. For more information, refer to the Asset Steps section in this chapter.
Tip: You can continue to navigate around your Site while in Performance Mode. Each time you load a new asset, it's performance will be analysed and the results displayed in your browser.
Performance Mode Interface
The Performance Mode interface is comprised of the Total Time, System and Queries fields; the Caching and User buttons; the Asset Count and Slowest Loading Assets fields; and the Performance Results Graph.
The Performance Mode interface is shown in the figure below (click to enlarge).
The Performance Mode interface
Total Time, System and Queries Fields
The Total Time, System and Queries fields
The Total Time field displays the total time taken to load your asset. The System field indicates what portion of this time can be attributed to system processing; the remaining time is attributed to individual asset loading.
In the figure to the right, for example, the asset has taken 2.18s to load, with 0.97s (or 44%) of this time attributed to system processing.
The Queries field lists a count of the total number of queries run on the loading of the asset.
Caching and User Buttons
The Caching Button
The Caching button allows you to monitor the performance of your asset using its default cache settings and when cache is disabled. This allows you to examine the impact of caching on your assets.
To switch the caching method, click the Caching button. The asset will be re-analysed with the new caching method and the performance results displayed.
By default, caching will be set to the asset's default settings. If you change this setting, the new caching method will be maintained as your navigate through the assets in your Site.
Similarly, the User button allows you to switch between viewing the performance of the asset viewed as the default user (the user currently viewing the asset) and when viewed as a Public User.
To switch the user type, click the User button. The asset will be re-analysed with the new user type and the performance results displayed.
By default, performance will initially be displayed for the default user, that is, the user who is currently viewing the asset. If you change this setting, the new user type will be maintained as you navigate through the assets in your Site.
Asset Count and Slowest Loading Assets Fields
The Asset Count field lists the total number of assets that have been loaded and analysed within the Performance Mode results, while the Slowest field displays a graphical measure of the slowest five assets to load.
The Asset Count and Slowest fields
Hovering over each segment of this bar will display the name, load time and number of queries run for the corresponding asset, as shown in the figure below.
Asset Information on the Slowest field
The five assets that take the longest time to load will be highlighted in the Performance Results Graph with the colours specified in this bar (i.e. the slowest asset will be red, etc.). For more information, refer to the Performance Results Graph section, below.
Performance Results Graph
The list of analysed assets
The Performance Results Graph displays a list of the analysed assets on the URL, alongside a graphical timeline of the loading of these assets.
On the left side of the Performance Results Graph, the asset's loaded on the URL will be listed in chronological order. For example, in the figure to the right, our Inside - Customisation - EES Design Customisation is the first analysed asset to be loaded on this particular URL.
For each listed asset, the asset ID, asset type and Step type will be listed. For more information on the Step type, refer to the Asset Steps section below.
On the right side of the Performance Results Graph, a timeline is displayed. A performance bar is shown on this timeline for each individual asset loaded on the page, graphically outlining the total load time of the asset.
The performance Timeline
These performance bars are presented as a series of dark and light segments, indicating when the asset was actively loading (dark) and when the asset was idle, due to other loading assets (light). The colour of each bar is determined by the total load time of the asset, as outlined in the table below.
| Performance Bar | Colour | Status |
|---|---|---|
|
Red | Slowest asset to load. |
|
Yellow | 2nd slowest asset to load. |
|
Blue | 3rd slowest asset to load. |
|
Purple | 4th slowest asset to load. |
|
Green | 5th slowest asset to load. |
|
Grey | Not among slowest loading assets. |
A graphical representation of the five slowest loading assets is displayed in the Slowest field. For more information, refer to the Asset Count and Slowest Loading Assets Fields section in this chapter.
Individual asset performance information
Hovering over an asset's performance bar will display the total and active load times for that specific asset, as well as the number of queries run.
Asset Steps
Some asset types, such as an Asset Listing Page, can contain multiple steps during loading. Performance Mode allows you to break these assets down and analyse the individual performance of each step.
To expand an asset, click on the 
icon in the list of analysed assets. The asset will be broken down into its individual load steps, as shown in the figure below. This will also section the performance bar
of the asset into individual steps.
Displaying the performance of the individual steps of an asset
The following asset types are currently supported for individual step analysis in Performance Mode:
- Asset Builder Page
- Asset Listing Page
- Search Page
Understanding the Performance Results
The results returned in Performance Mode are presented in a format that allows you to identify which assets in your system are causing the largest drain on performance and at what point during the asset's load time this is occurring. The following example (click to enlarge) will explain how to interpret and utilise these results.
An example performance report
In this example, our URL is taking a total of 0.54 seconds to load, with 0.46 seconds (76%) attributed to individual asset load time.
The colours of the assets on the performance Timeline indicate which assets took the longest time to load.
The asset colours on the performance Timeline
The Design Customisation of the page (asset #698) is coloured red, as it has taken the longest amount of time to load. The second longest asset to load was the Section Image Asset Listing Page (#666), in yellow, followed by the Standard Page Format Paint Layout (#950), in blue; the Right Content Asset Listing Page (#921), in purple; and the Scripts - Global Standard Page (#174), in green.
Looking at the Timeline, we can observe that asset #698 begins actively loading first. It is then idle for a short time while asset #174 loads - nested JavaScript content in the Design. The asset then continues loading for a significant length of time. This large amount of active load time can be attributed to the rendering of the main navigation menu and search bar Design Areas of our asset's Design.
The Design Customisation is again idle while asset #666 loads. This asset is a nested Asset Listing Page that prints the cartoon figure in the asset's Design and is the second slowest asset to load.
Expanding the Asset Listing Page tells us that the getAssetList and printBody processes are taking the longest amount of time to load, while the filterAssetList, groupAssets and chunkAssets load time is minimal.
Once this listing loads, the Design Customisation renders the Design Areas displaying the asset lineage and sub-menu. After this, asset #950 - a Paint Layout nested in the Design - is loaded. This asset prints the content of the current asset (#509), as well as asset #921, an Asset Listing Page on the right side of the page.
This Asset Listing Page prints the content of asset #944 during its printBody step, seen when we expand the listing on the performance Timeline, as shown in the figure below.
Analysing the Asset Listing Page's individual steps
Once the main content of the page is loaded, assets #657 and #2197 load. These assets contain the footer content of the page and a simple Easy Edit Suite JavaScript plugin; they are not significant to the overall load time of the URL.
From these results, we can distinguish that the biggest hits to performance on this URL are the loading of the search bar and main menu Design Areas on the Design Customisation and the Asset Listing Page, listing the cartoon figure.
If we were dissatisfied with the total load of the URL, we would know to target these areas when attempting to improve performance.