How to: Handle Large XAML Files

XAML has the capability to represent complex data structures. As a result, some XAML files can become very large. For example, a XAML representation of a vector image can be several megabytes in size. Large XAML files can cause performance issues in the WPF Designer for Visual Studio. The following procedures can help you handle performance issues caused by large blocks of XAML. 

XAML View Only

The best way to improve performance when you work with large XAML files in Visual Studio is to not use Design view in the WPF Designer. There are two approaches that you can use to edit XAML in Visual Studio without using Design view.

The first approach is to turn off Design view and use XAML view only. You can specify that XAML files should be opened in full XAML view only by changing a Text Editor option. By using this approach, you have full XAML editing support, the Document Outline window, and the tag navigator.

The second approach is to use the source code editor. You can open XAML files in source code editor by using the Open With dialog box. This is the most lightweight approach and provides the best performance for large XAML files. You have full XAML editing support, but you do not see the Document Outline window and the tag navigator.

To open XAML files in full XAML view

• Check the Always open documents in full XAML view option in the Text Editor options for XAML. For more information, see Formatting, XAML, Text Editor, Options Dialog Box.

  The next time that you open a XAML file, it will open in XAML view only.

To open XAML files in the source code editor

1. In Solution Explorer, right-click the XAML file to open.

2. From the shortcut menu, select Open With.

3. In the Open With dialog box, select Source Code (Text) Editor and click OK.

   The XAML file opens in the code editor.

Design View

You can use Design view to work with large blocks of XAML, but you may experience performance issues. The following suggestions may help improve performance.

To improve performance of Design view with large blocks of XAML

• Move your large block of XAML into a separate UserControl. By using this approach, you can add your large XAML file to the design surface with minimal performance impact.

• Move your large block of XAML into a XAML resource file. If this resource file is associated with a custom control, the large XAML file is loaded only when the designer opens the custom control.

• Restructure your XAML to minimize updates that include the large block of XAML.

  The following code example illustrates a Canvas element that contains a large block of XAML describing an image. A change to one of its sibling button controls forces the parent grid and all its children to update. Updating the Canvas element with a large block of XAML may decrease performance.

  <Window x:Class="WpfApplication1.MainWindow"
      xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
      Title="MainWindow" Height="300" Width="300">
      <Grid>
          <Canvas>
              <!-- Many paths describing an image. -->
          </Canvas>
          <Button />
          <Button />
          <Button />
      </Grid>
  </Window>
  

  The following code shows how to restructure the previous XAML to avoid performance issues.

  <Window x:Class="WpfApplication2.MainWindow"
      xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
      Title="MainWindow" Height="300" Width="300">
      <Grid>
          <Canvas>
              <!-- Many paths describing an image. -->
          </Canvas>
  
          <Grid>
              <Button />
              <Button />
              <Button />
          </Grid>
      </Grid>
  </Window>
  

  The button controls are no longer siblings to the Canvas element, and changes to one of the buttons does not force the Canvas element to update.

See Also

Reference

Formatting, XAML, Text Editor, Options Dialog Box

Concepts

Troubleshooting WPF and Silverlight Designer Load Failures

Other Resources

XAML and Code in the WPF Designer

Debugging and Interpreting Errors in the WPF Designer