An often overlooked performance tuning feature of Silverlight are the “Frame Rate Counters” and “Redraw Regions” options – Profiling, step aside! In this post I’ll explore the general options and how to enable them, I’ll follow up with a further post on how to use them to help identify performance bottlenecks.

This post is based off the awesome talk that Seema Ramchandani gave at Mix ’10.

Note: To test these out either open an existing Silverlight application, or start a new one. The screenshots in this post are mostly from the Windows Phone 7 Emulator (XDE) so will vary slightly to the desktop version.

Frame Rate Counters

• Enabling
  Open up App.xaml.cs and add the following bolded line to your App() constructor:
  

  public App()
  {
      UnhandledException += new EventHandler(Application_UnhandledException);
      InitializeComponent();
  
      App.Current.Host.Settings.EnableFrameRateCounter = true;
  }
  

• What you’ll see
  In the top left corner of the screen you should see the following counters:
  

  Silverlight Framerate Counters

  
  Note: On the desktop counter A & B are merged into one counter.

• I don’t see the counters! (mobile)
  This means that you are running without hardware acceleration. Either the machine running the emulator does not support hardware acceleration (DirectX 10 for the early refreshes) or you’ve run into a bug (there are a number of them which are currently being zapped) which has caused your device / emulator to run out of video memory. Restart the device / emulator and you should be right.

  Note: To tell if your emulator supports hardware acceleration (or if your device has run out of video memory) look at your screen as you launch a XAP – if it does the page flip animation then you’re ok, otherwise if the app just appears then you are in software.

• What do they mean?
  I’ve added letters to indicate the different fields as so:

  

  1. Render Thread Framerate (fps) (mobile only)
  2. UI Thread Rate Framerate (fps)
  3. Amount of VRAM used by App (kb)
  4. Total number of textures on GPU
  5. Number of intermediate textures

Redraw Regions

• Enabling
  Open up App.xaml.cs and add the following bolded line to your App() constructor:
  

  public App()
  {
      UnhandledException += new EventHandler(Application_UnhandledException);
      InitializeComponent();
  
      App.Current.Host.Settings.EnableRedrawRegions = true;
  }
  

• What you’ll see
  In this example I’m using the default Windows Phone list application and clicking through the list options and then back with the hardware back button.
  

  Redraw Regions highlighting redrawn areas as we transition between pages

• What am I looking at?
  Redraw regions highlights (tints) every part of the screen as it is redrawn, either due to a user initiated action (say, scrolling a non-cached list box) or some code (animation). Cached Objects that are being animated / moved / scrolled etc (BitmapCache) will not be redrawn, but as soon as the object is modified (say, you change its colour as it moves), it will be redrawn – and you will see this highlighted by EnabledRedrawRegions.

  As regions are redrawn the colours will cycle through Blue, Yellow, Pink (Purple) so that you can see the transition – there is no significance to the specific colours.