Back to Skills

rendering-wpf-high-performance

verified

Provides high-performance WPF rendering techniques including DrawingVisual, WriteableBitmap, CompositionTarget.Rendering, and BitmapCache. Use when implementing real-time graphics, game loops, particle systems, charts, or when Shape controls cause performance issues.

View on GitHub

Marketplace

dotnet-claude-plugins

christian289/dotnet-with-claudecode

Plugin

wpf-dev-pack

development

Repository

christian289/dotnet-with-claudecode
5stars

wpf-dev-pack/skills/rendering-wpf-high-performance/SKILL.md

Last Verified

January 23, 2026

Install Skill

Select agents to install to:

Scope:
npx add-skill https://github.com/christian289/dotnet-with-claudecode/blob/main/wpf-dev-pack/skills/rendering-wpf-high-performance/SKILL.md -a claude-code --skill rendering-wpf-high-performance

Installation paths:

Claude
.claude/skills/rendering-wpf-high-performance/
Powered by add-skill CLI

Instructions

# High-Performance WPF Rendering

## Quick Reference

| Technique | Use Case | Performance |
|-----------|----------|-------------|
| DrawingVisual | 1K-100K shapes | 10-50x faster than Shape |
| WriteableBitmap | Pixel manipulation, heatmaps | Fastest for raw pixels |
| CompositionTarget.Rendering | Game loops, real-time animation | ~60 FPS frame callback |
| BitmapCache | Complex static visuals | GPU texture caching |

## 1. DrawingVisual Pattern

Lightweight visual for high-volume rendering without layout overhead.
```csharp
public class ChartVisual : FrameworkElement
{
    private readonly VisualCollection _visuals;

    public ChartVisual() => _visuals = new VisualCollection(this);

    public void Render(IEnumerable<Point> points)
    {
        _visuals.Clear();
        var visual = new DrawingVisual();

        using (var dc = visual.RenderOpen())
        {
            var pen = new Pen(Brushes.Blue, 1);
            pen.Freeze();

            var prev = points.First();
            foreach (var pt in points.Skip(1))
            {
                dc.DrawLine(pen, prev, pt);
                prev = pt;
            }
        }

        _visuals.Add(visual);
    }

    protected override int VisualChildrenCount => _visuals.Count;
    protected override Visual GetVisualChild(int index) => _visuals[index];
}
```

**Key Points:**
- Always `Freeze()` Brush/Pen for thread safety and performance
- Use `StreamGeometry` instead of `PathGeometry` for read-only paths
- Override `VisualChildrenCount` and `GetVisualChild`

## 2. WriteableBitmap Pattern

Direct pixel manipulation for maximum performance.
```csharp
public class PixelCanvas : Image
{
    private WriteableBitmap _bitmap;

    public void Initialize(int width, int height)
    {
        _bitmap = new WriteableBitmap(width, height, 96, 96, PixelFormats.Bgra32, null);
        Source = _bitmap;
    }

    public unsafe void DrawPixel(int x, int y, Color color)
    {
        _bitmap.Lock();
        try
        {
       

Validation Details

Front Matter
Required Fields
Valid Name Format
Valid Description
Has Sections
Allowed Tools
Instruction Length:
4222 chars