D. Masterson
D. Masterson

Reputation: 61

How to measure XAML/UI performance in Universal Windows App?

I'm building a Universal Windows App (UWP) using the "Blank App" Visual C# template in Visual Studio. I want to measure two data points when I run my app:

For the first point, let's say I'm creating an app that has 5 ToggleSwitches defined as XAML in MainPage.xaml. I want to measure how long it takes for the UI to show all 5 ToggleSwitches. I've placed a Stopwatch timer right before the this.InitializeComponent() command in MainPage.xaml.cs (as I assume this is where the processing of Designer XAML elements begins). I want to stop the timer as soon as the window is properly painted. I've experimented with the Loaded and LayoutUpdated events for a XAML element, but neither is triggered as the UI is updated. Where do I place my timer to get the data I seek? If I'm stepping through code in the debugger, at what line of code would "Step Over" cause the UI to refresh?

For the second point, I just want to record how long the computer takes to internally process the XAML code (not including rendering the UI, running the composition engine, processing with Direct3D - just processing the XAML). My first instinct was to simply start the Stopwatch before this.InitializeComponent() and end immediately afterwards. However, I'm not seeing a change in data based on the content of the page. For example, whether I run my app with 100 ToggleSwitches or 5 ToggleSwitches defined on the XAML Designer, the this.InitializeComponent() method takes the same amount of time. Any ideas how I can better measure this data point?

Any help is much appreciated.

Upvotes: 6

Views: 955

Answers (1)

Application Timeline tool could probably help you (available with Visual Studio 2015).

Timeline
(source: s-msft.com)

Analyze UI responsiveness with the Application Timeline tool https://msdn.microsoft.com/en-us/library/dn957934.aspx

Upvotes: 3

Related Questions