Rendering Architecture
Avalonia’s rendering pipeline consists of several layers:- High-level API - Platform-agnostic drawing primitives
- Platform Render Interface - Abstraction over rendering backends
- Backend Implementations - Skia, Direct2D, or custom backends
- Graphics Context - OpenGL, Vulkan, Metal, or software rendering
Rendering Backends
Skia Backend (Default)
Avalonia uses SkiaSharp as its primary rendering backend. Skia is a cross-platform 2D graphics library used by Chrome, Android, and Flutter. From~/workspace/source/src/Skia/Avalonia.Skia/PlatformRenderInterface.cs:
Supported Graphics APIs with Skia
- OpenGL - Cross-platform, widely supported
- Vulkan - High-performance, modern graphics API
- Metal - Apple platforms (macOS, iOS)
- Software - CPU-based fallback rendering
Configuring the Rendering Backend
Graphics Context Selection
OpenGL Backend
From~/workspace/source/src/Avalonia.OpenGL/:
- OpenGL 3.2+ on Desktop
- OpenGL ES 2.0+ on Mobile/Embedded
Vulkan Backend
Vulkan provides high-performance, low-overhead rendering:- Windows (via Vulkan SDK)
- Linux (via Vulkan drivers)
- Android (native support)
- macOS (via MoltenVK)
Metal Backend (macOS/iOS)
Metal is automatically used on Apple platforms when available:Drawing Context
TheDrawingContext provides the high-level API for rendering.
From ~/workspace/source/src/Skia/Avalonia.Skia/DrawingContextImpl.cs:
DrawingContext Architecture
Key Rendering Features
Supported drawing operations:- Primitives (lines, rectangles, ellipses, paths)
- Text rendering with advanced typography
- Image rendering with transformations
- Gradient fills (linear, radial, conic)
- Brush effects (solid, gradient, image, visual)
- Clipping and masking
- Effects (blur, drop shadow, etc.)
Custom Drawing
Render Loop
Avalonia uses a render loop to coordinate rendering across the application.Render Loop Architecture
From~/workspace/source/src/Avalonia.Base/Rendering/:
Render Timing
Avalonia provides multiple render timer implementations:- DefaultRenderTimer - Uses platform vsync when available
- UiThreadRenderTimer - Renders on UI thread
- SleepLoopRenderTimer - Thread-sleep based timing
- ThreadProxyRenderTimer - Proxies to another thread
Custom Render Loop Integration
Rendering Optimization
Dirty Rectangle Tracking
Avalonia tracks which regions need repainting to minimize rendering overhead:Layer Caching
Use render target bitmaps to cache complex rendering:GPU Acceleration
Render Transform vs. Layout Transform
RenderTransform for:
- Animations
- Visual effects
- Temporary transformations
LayoutTransform for:
- Permanent transformations affecting layout
- When child elements need to respond to transformation
Platform-Specific Rendering
Windows
- Primary: Skia + Direct3D 11 (via ANGLE)
- Fallback: Skia + Software
macOS
- Primary: Skia + Metal
- Fallback: Skia + OpenGL
Linux
- Primary: Skia + Vulkan (when available)
- Secondary: Skia + OpenGL
- Fallback: Skia + Software
Mobile (iOS/Android)
- iOS: Skia + Metal
- Android: Skia + Vulkan or OpenGL ES
Browser (WebAssembly)
- Primary: Skia + WebGL
- Fallback: Skia + Software (rendered to canvas)
Advanced Rendering Topics
Pixel Format Support
From the Skia backend:Bgra8888- 32-bit with premultiplied alpha (default)Rgba8888- 32-bit RGBARgb565- 16-bit RGB (mobile optimization)
DPI Scaling
Avalonia handles DPI scaling automatically:Render Options
Control rendering quality and performance trade-offs:Default- Platform defaultLowQuality- Fastest, lower quality (nearest neighbor)MediumQuality- BalancedHighQuality- Slowest, best quality (bicubic)
Antialias- Grayscale antialiasingSubpixelAntialias- RGB subpixel antialiasing (default)Alias- No antialiasing
Debugging Rendering
Renderer Diagnostics
Available Debug Overlays:
Fps- Frames per second counterLayoutTimeGraph- Layout pass timingRenderTimeGraph- Render pass timingDirtyRects- Shows invalidated regions
See Also
- Performance Optimization - Rendering performance best practices
- Composition - Low-level composition API
- Animations - Animation system details