The Performance Path widget gives you a great view of how your critical purchase path or customer journey is performing for real users, compared to a baseline. Like the KPI Date Comparison widget, there are a number of comparisons you can configure this widget for. In this article, we'll go over each of them and show you everything the widget can do.
- Configuration and Types of Comparisons
- About the Widget
- Best Practices
In order to configure a Performance Path widget, you'll need to have first created a Real User Path. You can do this on the Real User Paths page.
Configuration and Types of Comparisons
To get started, choose the Performance Path widget type. Next, select the path or paths you'd like to monitor. You can also choose any filtering at the bottom of the configuration panel. Once those are set, the next and most important part is choosing the Type of Comparison. There are 3 different types of comparison with this widget, but depending on which is selected, there will be more options to specify the details. Here's a breakdown of the options and sub-options:
- Same Day Last Month
- Same Day Last Year
- Custom Selector
- Past X Days/Weeks
For example with the Custom Selector you could choose to see the average for the past 3 days or the average for the past 8 weeks.
Next, you can configure Path Overview Metrics. This section allows you to configure the information that will show in the widget. Also, it allows you to configure the Threshold Percent Change - this is the threshold when, if the current value deviates from the baseline greater than the specified percentage, the area in the widget with the metric will appear red. Note: This only affects the "Detail Level" part of the widget.
Once you have your comparison configured, create or update the widget and let's dive into what you'll see when it loads in the page.
About the Performance Path Widget
The Widget is broken out into two main sections: High Level and Detail Level. In this section we'll go over the following:
- Widget Controls
- High Level view
- Detail Level view
When you first load the dashboard widget you'll see the left panel showing your device filtering along with a selector for your path. If you set up the widget with more than one path, you can change the path displayed in the widget by selecting another path in the Selected Path drop down.
Toggle between the High Level view and the Detail Level view by clicking the buttons in the top right.
Also, the device buttons in the top right are clickable and allow you to filter the High Level view by the selected device. You can only choose one device at a time. From left to right we have: All Devices, Desktop, Mobile and Tablet. To revert to All Devices, simply click the All Devices icon to the left.
High Level View
This view displays a card for each step in the path containing the average number for today on the top and the baseline on the bottom. To the right you'll see a delta, color-coded in green for better performance and red for worse performance, today versus the baseline.
Detail Level View
The Detail View has loads of great comparison information.
- Detail Level Overview
- Path Level (Top Section)
- Device Level (Middle Section)
- Step/Page Level (Bottom Section)
Detail Level Overview
The Detail Level is divided into 3 sections: Path, Device and Step/Page level. The highlighted row of each section indicates it is filtering down the data in the section below it.
For example, if you have multiple paths selected, you can click the row in the table for a different path and it updates the data below for that path - in the Device level and the Step/Page level. Then, in the Device level you can click a device and it will filter down and update the data in the Step/Page level.
When you click one of the rows, the row becomes highlighted and the sections below update.
Path Level (Top Section)
The Path Level displays the Path Overview Metrics - these are the metrics and numbers set in the widget configuration. Here the metrics using averages are shown to the left and the numbers that are totaled to the right.
In each cell you can see a trend line with both today's data and the baseline data. The top left shows the average/total for today, and the top right shows the average/total for the baseline. In the middle you will see a red or green number that is a delta - green for better and red for worse.
The Path level Onload represents the sum of the average Onload for each step in the path. The same is true of the other performance numbers (DOM Duration, Time to DOM Interactive, and Time to DOM Content Loaded). The Pages per Session, Page Views, Orders and Revenue are all calculated at the path level.
Device Level (Middle Section)
The Device level shows you the Path level details broken out by device.
Step/Page Level (Bottom Section)
The bottom section is the Device level which shows you the data filtered by path and device, broken out by step. In the example from the images above, here we are looking at the performance of each step in the Demo Path for iPhone users.
Best Practices with the Performance Path Widget
This widget works optimally when it's the only dashboard widget in your dashboard. Additionally, because there's so much information in the widget, it's helpful to expand the widget as tall and wide as the screen will allow.