Thursday, May 13, 2010

Silverlight on Windows 7 Phone – Performance Tuning

Recently, I have been reviewing some of the content from MIX10, specifically pertaining to the talks on the new Windows Phone.  I came upon the talk from Seema Ramchandani (  This was full of good tips on performance tools and tuning for Silverlight on the phone.  I wanted to share the items that stood out to me.

First, the idea of having a UI thread (that uses the phone CPU) and a Render thread (that runs on the GPU) is key to making a smooth rich interface.  The UI thread should be reserved for input primarily with the animations and other calculations being done on the render thread.

UI Virtualization-

For instance the listbox shows by default (styles) 6 rows.  What is hidden is that the 5 above and 5 below are also in the visual tree.  These are not recreated as the ui is scrolled but simply reused.

The Loop of all Loops (render loop)

A timer in triggers the render loop every 33 milliseconds and attempts to draw.  First we check for property changes (ie. movement).  Then the visual tree is recurred 2 times.  First to see “how big” everything is.  Then on the second pass arranging the items to be rendered is performed (and clipping).  Next we queue up the rendering changes.  Only one back buffer is rasterized per frame.  And then the buffer is rendered.


  • Enable frame rate counter (in main)
  • Enable redraw regions (to see what is being redrawn in different colors)

We should only be drawing the changes, and the redraw regions flag will show you what this is.  Lots of colors is bad :).


  • Render thread
  • UI thread
  • Child threads
      • Rasterization
      • Media Decoding


  • Less is more – keep the app lean for best performance (goes without saying)
  • Limit activity on UI thread
  • Leverage render thread
  • Leverage GPU
  • Debug, Debug, Debug

Active input on the device can take 15-25% of the device CPU!  Thus, we need the render thread to keep the application responding real time.

Quick way to check if we are using the GPU.  Enable the frame rate counter.  If this is rendered when you run the application, then the GPU is being used.

Use CacheMode=”Bitmap Cache” to force bitmap caching for GPU optimization.  Certain items will cache automatically (ie. double animations).

Order is important in the xaml to keep the cached bitmaps close together (less textures), which will increase gpu performance.

Media and effects in the same frame == bad!

Max texture size on desktop and phone is 2048 in any direction.

60 fps in the CTP, but will be limited to 30 fps max on release build (to keep battery life as high as possible).

No comments: