{"id":5474,"date":"2021-04-22T15:44:22","date_gmt":"2021-04-22T22:44:22","guid":{"rendered":"https:\/\/devblogs.microsoft.com\/pix\/?p=5474"},"modified":"2021-04-22T17:12:55","modified_gmt":"2021-04-23T00:12:55","slug":"usability-improvements-to-the-timing-capture-metrics-view","status":"publish","type":"post","link":"https:\/\/devblogs.microsoft.com\/pix\/usability-improvements-to-the-timing-capture-metrics-view\/","title":{"rendered":"Usability improvements to the Timing Capture Metrics View"},"content":{"rendered":"<p>The <a href=\"https:\/\/devblogs.microsoft.com\/pix\/download\/\">2104.20 release of PIX on Windows<\/a>\u00a0includes several usability improvements to the Metrics View in <a href=\"https:\/\/devblogs.microsoft.com\/pix\/timing-captures-new\/\">Timing Captures.<\/a>\u00a0 These usability improvements make it easier to manage the set of metrics that are currently graphed.\u00a0 Metrics analysis is also improved through the ability to customize the minimum and maximum values for the y-axis for each metric.<\/p>\n<p>These usability improvements are provided by a new <strong>Active Metrics<\/strong> panel.\u00a0 This new panel lists all metrics that have been added to the graph from either the <strong>Selector<\/strong> panel or the <strong>Timeline<\/strong> view. The table of graphed metrics includes a checkbox that can be used to toggle whether a given metric is currently graphed. The <strong>Active Metrics<\/strong> panel also includes a number of controls that can be used to customize the following aspects of how a metric is graphed:<\/p>\n<ul>\n<li>line style<\/li>\n<li>color<\/li>\n<li>aggregation mode<\/li>\n<li>minimum and maximum values of the y-axis<\/li>\n<\/ul>\n<p>The ability to remove a metric from the active list is also provided.<\/p>\n<p>Given the volume of available metrics in a typical title, grouping all active metrics together in a single table makes it easier to manage the set of metrics that are currently graphed.<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/pix\/wp-content\/uploads\/sites\/41\/2021\/04\/active_metrics_panel_2104.png\"><img decoding=\"async\" class=\"alignnone size-full wp-image-5477\" src=\"https:\/\/devblogs.microsoft.com\/pix\/wp-content\/uploads\/sites\/41\/2021\/04\/active_metrics_panel_2104.png\" alt=\"Image active metrics panel 2104\" width=\"1370\" height=\"779\" srcset=\"https:\/\/devblogs.microsoft.com\/pix\/wp-content\/uploads\/sites\/41\/2021\/04\/active_metrics_panel_2104.png 1370w, https:\/\/devblogs.microsoft.com\/pix\/wp-content\/uploads\/sites\/41\/2021\/04\/active_metrics_panel_2104-300x171.png 300w, https:\/\/devblogs.microsoft.com\/pix\/wp-content\/uploads\/sites\/41\/2021\/04\/active_metrics_panel_2104-1024x582.png 1024w, https:\/\/devblogs.microsoft.com\/pix\/wp-content\/uploads\/sites\/41\/2021\/04\/active_metrics_panel_2104-768x437.png 768w\" sizes=\"(max-width: 1370px) 100vw, 1370px\" \/><\/a><\/p>\n<p>Use the checkbox to the left of a metric to toggle the graph state. Pressing the spacebar while a row is selected also toggles the graph state. The up and down arrow keys can be used to navigate between rows.<\/p>\n<p>Use the Remove button, or the delete key, to remove a metric from the active metrics panel.<\/p>\n<p>Ctrl-A will select all metrics in the table. Using Ctrl-A along with the space bar or delete key is a fast way to toggle the graph state or remove all metrics.<\/p>\n<h4>Aggregation Mode<\/h4>\n<p>Depending on the volume of data in the capture, the Metrics View may not be able to draw a single point for every value of a metric that was captured. When this occurs, a number of data points will be aggregated together. The tooltip will include the number of points that have been aggregated.<\/p>\n<p>By default, the maximum value of the aggregated metrics will be graphed. This aggregation mode can be changed using the dropdown in the <strong>Aggregation<\/strong> column as shown in the following figure.<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/pix\/wp-content\/uploads\/sites\/41\/2021\/04\/active_metrics_panel_aggregation.png\"><img decoding=\"async\" class=\"alignnone size-full wp-image-5478\" src=\"https:\/\/devblogs.microsoft.com\/pix\/wp-content\/uploads\/sites\/41\/2021\/04\/active_metrics_panel_aggregation.png\" alt=\"Image active metrics panel aggregation\" width=\"779\" height=\"723\" srcset=\"https:\/\/devblogs.microsoft.com\/pix\/wp-content\/uploads\/sites\/41\/2021\/04\/active_metrics_panel_aggregation.png 779w, https:\/\/devblogs.microsoft.com\/pix\/wp-content\/uploads\/sites\/41\/2021\/04\/active_metrics_panel_aggregation-300x278.png 300w, https:\/\/devblogs.microsoft.com\/pix\/wp-content\/uploads\/sites\/41\/2021\/04\/active_metrics_panel_aggregation-768x713.png 768w\" sizes=\"(max-width: 779px) 100vw, 779px\" \/><\/a><\/p>\n<h4>Customizing the minimum and maximum values for the y-axis<\/h4>\n<p>In most cases, the default min and max values of the y-axis are the minimum and maximum values for the metric as seen over the duration of the capture. However, there are some cases, such as CPU Usage (Sampled), in which the default minimum and maximum values are known ahead of time. In these cases, the min and max values of the y-axis are fixed. In the CPU Usage (Sampled) example, the default min and max values would be 0 and 100 respectively.<\/p>\n<p>The default min and max values of the y-axis are also influenced by the set of graphed counters that have the same units. In this case, the min value is the minimum value from across all of the metrics and the max value is the maximum value from across all metrics. For example, consider the following example in which three PIX events are graphed, all will different minimum and maximum nanosecond values.<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/pix\/wp-content\/uploads\/sites\/41\/2021\/04\/active_metrics_panel_varying_min_max_values.png\"><img decoding=\"async\" class=\"alignnone size-full wp-image-5479\" src=\"https:\/\/devblogs.microsoft.com\/pix\/wp-content\/uploads\/sites\/41\/2021\/04\/active_metrics_panel_varying_min_max_values.png\" alt=\"Image active metrics panel varying min max values\" width=\"775\" height=\"159\" srcset=\"https:\/\/devblogs.microsoft.com\/pix\/wp-content\/uploads\/sites\/41\/2021\/04\/active_metrics_panel_varying_min_max_values.png 775w, https:\/\/devblogs.microsoft.com\/pix\/wp-content\/uploads\/sites\/41\/2021\/04\/active_metrics_panel_varying_min_max_values-300x62.png 300w, https:\/\/devblogs.microsoft.com\/pix\/wp-content\/uploads\/sites\/41\/2021\/04\/active_metrics_panel_varying_min_max_values-768x158.png 768w\" sizes=\"(max-width: 775px) 100vw, 775px\" \/><\/a><\/p>\n<p>In this case, the minimum value across all three metrics is 132 (from <em>DoingWork<\/em>) and the maximum value across all three metrics is 1,078,765,734 (from <em>MainLoop<\/em>). These two values define the default min and the max values for the y-axis for these three metrics.<\/p>\n<p>There are cases in which the default min and max values for the y-axis may not be optimal. One such example occurs when the ranges of two or more graphed metrics differ significantly. In this case, the default min and max y-axis may make it impossible to differentiate individual values for some of the metrics. In the following figure, the graph of the <em>MainLoop<\/em> metric is easily readable, but the graph of the <em>RenderWorker::Process<\/em> metric appears as a single line at the bottom of the graph.<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/pix\/wp-content\/uploads\/sites\/41\/2021\/04\/active_metrics_panel_sub_optimal_y_axis.png\"><img decoding=\"async\" class=\"alignnone size-full wp-image-5480\" src=\"https:\/\/devblogs.microsoft.com\/pix\/wp-content\/uploads\/sites\/41\/2021\/04\/active_metrics_panel_sub_optimal_y_axis.png\" alt=\"Image active metrics panel sub optimal y axis\" width=\"825\" height=\"517\" srcset=\"https:\/\/devblogs.microsoft.com\/pix\/wp-content\/uploads\/sites\/41\/2021\/04\/active_metrics_panel_sub_optimal_y_axis.png 825w, https:\/\/devblogs.microsoft.com\/pix\/wp-content\/uploads\/sites\/41\/2021\/04\/active_metrics_panel_sub_optimal_y_axis-300x188.png 300w, https:\/\/devblogs.microsoft.com\/pix\/wp-content\/uploads\/sites\/41\/2021\/04\/active_metrics_panel_sub_optimal_y_axis-768x481.png 768w\" sizes=\"(max-width: 825px) 100vw, 825px\" \/><\/a><\/p>\n<div>\n<div class=\"halcyon-chm\">\n<p>The min and max values of the y-axis can be customized for each metric to make analysis easier in cases like this. To set custom values for the y-axis, uncheck the <strong>Auto fit<\/strong> checkbox. Doing so causes the <strong>Y-axis min<\/strong> and <strong>Y-axis max<\/strong> fields to be editable. Enter the custom values directly in the edit boxes. In the following figure, the max y-axis value for <em>RenderWorker::Process<\/em> has been customized such that the graph for that metric is now readable alongside the graph for <em>MainLoop<\/em>.<\/p>\n<p><a href=\"https:\/\/devblogs.microsoft.com\/pix\/wp-content\/uploads\/sites\/41\/2021\/04\/active_metrics_panel_y_axis_customization.png\"><img decoding=\"async\" class=\"alignnone size-full wp-image-5481\" src=\"https:\/\/devblogs.microsoft.com\/pix\/wp-content\/uploads\/sites\/41\/2021\/04\/active_metrics_panel_y_axis_customization.png\" alt=\"Image active metrics panel y axis customization\" width=\"1114\" height=\"522\" srcset=\"https:\/\/devblogs.microsoft.com\/pix\/wp-content\/uploads\/sites\/41\/2021\/04\/active_metrics_panel_y_axis_customization.png 1114w, https:\/\/devblogs.microsoft.com\/pix\/wp-content\/uploads\/sites\/41\/2021\/04\/active_metrics_panel_y_axis_customization-300x141.png 300w, https:\/\/devblogs.microsoft.com\/pix\/wp-content\/uploads\/sites\/41\/2021\/04\/active_metrics_panel_y_axis_customization-1024x480.png 1024w, https:\/\/devblogs.microsoft.com\/pix\/wp-content\/uploads\/sites\/41\/2021\/04\/active_metrics_panel_y_axis_customization-768x360.png 768w\" sizes=\"(max-width: 1114px) 100vw, 1114px\" \/><\/a><\/p>\n<div>\n<div class=\"halcyon-chm\">\n<p>Select the <strong>Auto fit<\/strong> checkbox to restore the default min and max y-axis values for a metric.<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>The 2104.20 release of PIX on Windows\u00a0includes several usability improvements to the Metrics View in Timing Captures.\u00a0 These usability improvements make it easier to manage the set of metrics that are currently graphed.\u00a0 Metrics analysis is also improved through the ability to customize the minimum and maximum values for the y-axis for each metric. These [&hellip;]<\/p>\n","protected":false},"author":1915,"featured_media":5481,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[1],"tags":[],"class_list":["post-5474","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-pix"],"acf":[],"blog_post_summary":"<p>The 2104.20 release of PIX on Windows\u00a0includes several usability improvements to the Metrics View in Timing Captures.\u00a0 These usability improvements make it easier to manage the set of metrics that are currently graphed.\u00a0 Metrics analysis is also improved through the ability to customize the minimum and maximum values for the y-axis for each metric. These [&hellip;]<\/p>\n","_links":{"self":[{"href":"https:\/\/devblogs.microsoft.com\/pix\/wp-json\/wp\/v2\/posts\/5474","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devblogs.microsoft.com\/pix\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/devblogs.microsoft.com\/pix\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/pix\/wp-json\/wp\/v2\/users\/1915"}],"replies":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/pix\/wp-json\/wp\/v2\/comments?post=5474"}],"version-history":[{"count":0,"href":"https:\/\/devblogs.microsoft.com\/pix\/wp-json\/wp\/v2\/posts\/5474\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/pix\/wp-json\/wp\/v2\/media\/5481"}],"wp:attachment":[{"href":"https:\/\/devblogs.microsoft.com\/pix\/wp-json\/wp\/v2\/media?parent=5474"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/pix\/wp-json\/wp\/v2\/categories?post=5474"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/pix\/wp-json\/wp\/v2\/tags?post=5474"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}