Alex Golesh's Blog About Silverlight Development

Silverlight application performance - refresh rate & CPU usage

You just wrote great Silverlight application? How about CPU usage? Do you have pretty static application UI and it still consumes 25-30% of your CPU? Probably you have to control how fast Silverlight should redraw the UI.

To do it, you need to specify MaxFrameRate property in object initialization, like follows:

   1: <asp:Silverlight ID="Xaml1" runat="server" 

   2:     Source="~/ClientBin/ShowFPS.xap" 

   3:     MinimumVersion="2.0.30523" 

   4:     Width="100%" Height="100%"             

   5:     MaxFrameRate="30" 

   6: />

Default value is 60fps, which is pretty high and will made animations looks very smooth. But if you application doesn't have much animations, or your UI is not changing much? Why not limit it to some acceptable value? Even if you application play video stream the MaxFrameRate shouldn't be much faster, than encoded stream rate. NTSC video encoded at 29.92fps, average on-demand video streams encoded at 15fps - why not limit your application at 30fps? To demonstrate the difference I've wrote sample application, with VERY dynamic UI: it has bouncing ball (which is actually canvas with many path objects inside) animation and video (Vista's sample "Butterfly.wmv" encoded at 29fps) played at a background. I'm also have some storyboard running which actually enables me to move ball canvas and calculate/update framerate.

Here is unrestricted framerate screenshot:

59-60fps according to calculations, 25-30% CPU.

Here is the same application with MaxFrameRate applied:

29-30fps(exactly like we wanted), 12-15% CPU load. Video is very smooth, animation is also smooth, bit plays slower.

Here is same application at 15fps:

14-15fps(exactly like we wanted), 6-10% CPU load. Video is still pretty smooth, but "jumps" sometime. For local played file it could be visible, but for network stream it is pretty acceptable.

So, next time when writing Silverlight application, consider specifying MaxFrameRate to ease on CPU.

Another nice feature of Silverlight plugin - show actual/desired framerate. To enable it add EnableFrameRateCounter="true" in object definition:

   1: <asp:Silverlight ID="Xaml1" runat="server" 

   2:     Source="~/ClientBin/ShowFPS.xap" 

   3:     MinimumVersion="2.0.30523" 

   4:     Width="100%" Height="100%" 

   5:     EnableFrameRateCounter="true"            

   6:     MaxFrameRate="30" 

   7: />

(*) This will work only in IE.

Here is couple more of performance tips:

1. IsWindowless ="false" is faster. Unless you application requires overlay of HTML content on top of Silverlight, don't turn it on.

2. Use solid/opaque background for Silverlight HTML object - it is faster.

3. Try to avoid usage of transparent/semi-transparent colors for XAML controls.

4. Use Visibility="Collapsed" instead of Opacity=0 to hide XAML control.

That's it for now.

Implementation of Silverlight FPS counter and/or application sources could be found here.

Enjoy,

Alex