rendering-wpf-high-performance

Implements high-performance WPF rendering using DrawingVisual, WriteableBitmap, CompositionTarget.Rendering, and BitmapCache.

Updated Nov 22, 2023
One-click install
npx skills add https://github.com/parksanghoon-sys/TestCode --skill rendering-wpf-high-performance-parksanghoon-sys
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: rendering-wpf-high-performance
Source: https://github.com/parksanghoon-sys/TestCode/tree/main/src/Modbus/wpf-dev-pack/.agents/skills/rendering-wpf-high-performance
Command: npx skills add https://github.com/parksanghoon-sys/TestCode --skill rendering-wpf-high-performance-parksanghoon-sys

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? WPF applications that render thousands of Shape elements, real-time charts, or game loops suffer from severe UI slowdowns because standard controls carry layout and rendering overhead. This Skill provides proven patterns to render 1K-100K visual elements at interactive frame rates. ## Core Features & Use Cases - DrawingVisual Pattern: Render 1K-100K shapes 10-50x faster than Shape controls using lightweight visuals with VisualCollection hosting. - WriteableBitmap Pixel Manipulation: Direct pixel-level drawing for heatmaps and real-time imagery using unsafe back-buffer access with partial dirty-rect updates. - CompositionTarget.Rendering Game Loops: Per-frame callbacks at ~60 FPS for animations, particle systems, and physics updates with delta-time handling. - BitmapCache GPU Caching: Cache complex static visuals as GPU textures to accelerate transform animations. - Use Case: A WPF chart displaying 50,000 data points renders in ~500ms with Shape elements; switching to DrawingVisual drops this to ~20ms, enabling smooth real-time updates. ## Quick Start Ask the AI to rewrite a slow WPF chart that uses thousands of Shape elements into a DrawingVisual-based implementation for real-time performance.

Frequently Asked Questions about rendering-wpf-high-performance

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I render thousands of shapes in WPF without lag?▼

Use DrawingVisual hosted inside a FrameworkElement with a VisualCollection instead of Shape controls. DrawingVisual skips layout and data-binding overhead, rendering 10K points in roughly 20ms versus 500ms for Shape elements.

How to implement a game loop in WPF with CompositionTarget.Rendering?▼

Subscribe to CompositionTarget.Rendering for a per-frame callback at roughly 60 FPS, cast the event args to RenderingEventArgs, and compute delta time from RenderingTime. Always unsubscribe in the Unloaded event to prevent memory leaks.

DrawingVisual vs WriteableBitmap: which should I use in WPF?▼

Use DrawingVisual for vector-style rendering of 1K-100K shapes like charts and diagrams. Use WriteableBitmap when you need direct pixel manipulation such as heatmaps or procedural images, where unsafe back-buffer access achieves the fastest updates.

Does WriteableBitmap require unsafe code in C#?▼

Maximum-performance pixel writes use unsafe pointer access to BackBuffer, requiring AllowUnsafeBlocks enabled in the .csproj file. A managed path exists but is slower; both approaches use AddDirtyRect to invalidate only changed regions.

When should I not use BitmapCache in WPF?▼

Avoid BitmapCache for content that changes frequently, since the GPU texture must be re-uploaded on every change, and for simple shapes like Rectangle or Ellipse where caching overhead outweighs benefits. It works best for complex static visuals under transform animations.