Performance Tips

Test on Multiple Platforms and Browsers

If you are developing Silverlight-based applications for multiple operating systems (for example, Macintosh and Windows) and browsers (for example, Internet Explorer, Mozilla Firefox, and Apple Safari), remember to routinely test your applications by using the platform and browser combinations that you are targeting. The differences in platform or browser behavior, and the code Silverlight uses to handle the behavior, can affect application performance. In particular, you should test thoroughly when you create applications that have transparent embedded plug-in backgrounds, or applications that use a large amount of procedural code (for example, C#, or Visual Basic).

Set EnableFrameRateCounter to true During Development

The rendering performance of the plug-in varies with the hosting parameters that are specified and the complexity of the content. We recommend that you set the EnableFrameRateCounter property to true during development. This setting displays the frames-per-second (fps) of the rendered Silverlight content in the browser's status bar, so you can fine-tune your application. The format of the frame rate counter is as follows:

**fps:**currentFramerate/maxFramerate

currentFramerate is the optimal frame rate that would apply in absence of an upper frame rate limit, based on conditions of the plug-in's environment and reported by the plug-in. maxFramerate is configurable, via the framerate initialization parameter (see How to: Add Silverlight to a Web Page by Using HTML). maxFramerate defaults to 24. Each of these numbers is a value reporting frames per second (fps). These values are interpreted to mean that whichever number is lower is the actual displayed frame rate. You can illustrate this relationship between currentFramerate and maxFramerate and by setting a deliberately low frame rate such as 2 per second and observing the results.

Use Transparent Background for a Silverlight Plug-in Sparingly

A transparent background may be useful, for example, when your embedded Silverlight plug-in contains a nonrectangular shape such as a picture of a car, and you do not want to show the rectangle surrounding the car. You can make only the picture of the car visible by setting the background of the Silverlight plug-in to transparent. However, using a transparent background for a Silverlight plug-in has a significant effect on performance, so avoid using this functionality whenever possible.

When Animating the Opacity or Transform of a UIElement, set its CacheMode

If you set CacheMode on a UIElement, rendering operations from RenderTransform and Opacity changes execute on the graphics processing unit (GPU), if available. It is important that you only set CacheMode on objects that are either being transformed or having opacity changes applied because otherwise the object will not benefit from caching and performance could be worse than if you did not cache it.

Cache Visual Elements when Blending layers using Opacity and Rotating or Stretching Objects

You can set the CacheMode property on a UIElement in order to cache it (and its children) as a bitmap; however, doing this can actually harm performance in some scenarios. For more information, see Cached Composition.

Avoid Using Windowless Mode

Set the Windowless property to true only when necessary. Performance is seriously impacted when in windowless mode (for example, tearing in animations). Due to this, media playback is not recommended at all in windowless mode.

Use Visibility Instead of Opacity Whenever Possible

If you simply want to make an object discretely visible or not visible, as opposed to using partial opacity or fading the object in or out of view, use the Visibility property instead of Opacity property. Opacity is associated with higher costs because the object is still hit tested and technically rendered. Setting Visibility to Collapsed avoids these costs.

Silverlight Uses Multi-Core in Rendering and Media

Silverlight takes advantage of multi-core for rendering and media playback. Therefore, your Silverlight-based applications will perform faster on multi-core systems.

In Full-Screen Mode, Hide Unused Objects

When your application goes into full-screen mode, hide all objects that are not being rendered in full-screen mode, or disconnect them from the tree. You can hide an object by setting its Visibility property to Collapsed.

Do Not Use Width and Height with MediaElement Objects

Avoid explicitly setting the width and height of a MediaElement object. Instead, let the media element display at its natural size. If you need to change the display size of the element, it is best to re-encode the media to the desired size by using a media encoding tool.

Do Not Use Width and Height with Path Objects

Do not set the Width and Height properties for a Path object. Setting these properties will result in additional stretching, which affects performance. Instead, rely on the explicitly set coordinates of the Path object to control its shape and position, and the Path will have a "natural" width and height.

Break Up CPU-Intensive Work into Smaller Tasks

When procedural code is running (for example, C# or Visual Basic), the plug-in stops drawing. Typically, this is not an issue if minimal work is done in the event handlers. However, if your application requires substantial, CPU-intensive work on the programmatic thread, we recommend that you split that work into smaller tasks. This will allow rendering to keep up with the desired frame rate.

Break Up Large Application Packages

In some cases, the Silverlight plug-in fails to load very large application package (.xap) files. When you create large applications, you should consider factoring some resource files or library assemblies into separate modules that you retrieve on demand. For more information, see Application Structure.

Use Double.ToString(CultureInfo.InvariantCulture) Rather Than Double.ToString()

The Double.ToString(IFormatProvider) method with a provider value of CultureInfo.InvariantCulture is optimized for performance. In general, the best practice is to use Double.ToString(CultureInfo.InvariantCulture) when you do not plan to show the data to the user or want the same result across cultures (for example, when comparing strings).

If your application displays numbers to the user and you want to display these numbers in the correct culture, you should use the Double.ToString(IFormatProvider) method with a provider value of CultureInfo.CurrentCulture or the zero-argument Double.ToString(), both of which perform a culture-sensitive conversion.

Use Stretch="Fill" When Rendering a Lot of Images

Although unintuitive, in some cases you can get better performance by setting Stretch properties to Fill instead of other values, including None. When you use Stretch = Fill, there is no potential clipping happening which adds extra edges. Any other type of stretch besides Fill needs to compute layout (e.g. compute centering). You will probably not notice the difference unless you are rendering a lot of images.

See Also

Other Resources