Tutorial 65: MSAA Anti-Aliasing

CNA Tutorials  ·  Advanced Rendering

Aliasing — the "staircase" jagged edge effect on geometry silhouettes — is one of the most immediately visible quality issues in 3D rendering. This tutorial covers Multi-Sample Anti-Aliasing (MSAA), CNA's primary hardware-accelerated AA mode, and the FXAA post-process alternative for renderers and devices where MSAA is unavailable or too expensive.

What is MSAA?

Multi-Sample Anti-Aliasing (MSAA) works by rendering each pixel at multiple sub-pixel sample positions and averaging the results. For a 4x MSAA framebuffer, the GPU maintains four samples per pixel, each with an independent depth and stencil value. The fragment shader runs once per pixel (not once per sample), but the coverage test runs per-sample. At pixels where a triangle edge crosses, only some of the four samples fall inside the triangle; those samples get the triangle's colour and the others keep the background colour. When the frame is displayed, the four samples are averaged ("resolved"), producing a smooth anti-aliased edge.

MSAA is highly effective at eliminating geometric aliasing (jagged polygon edges) because it operates at the rasterisation level with GPU hardware support. It is less effective at texture aliasing (shimmer on distant surfaces with high-frequency detail) — that requires mipmapping and anisotropic filtering (covered in the texture tutorials). Post-process AA techniques like FXAA or TAA can complement MSAA for texture-related aliasing.

Key characteristics of MSAA compared to alternatives:

• Geometry edges — excellent. Hardware MSAA eliminates staircase edges on triangles.
• Texture shimmer — no improvement without mipmapping; MSAA does not help here.
• Fragment shader cost — the fragment shader runs only once per pixel, not per sample (unlike SSAA). This makes 4x MSAA much cheaper than 4x SSAA.
• Depth and stencil — per-sample depth and stencil are maintained, so depth testing at edges remains correct.
• Memory cost — proportional to sample count. 4x MSAA uses 4x the framebuffer memory and 4x the depth/stencil memory.

PreferMultiSampling Flag

In CNA, MSAA is enabled by setting PreferMultiSampling on the GraphicsDeviceManager before Run() is called. This tells the renderer to request a multisampled swap chain or framebuffer from the OS/driver:

class MyGame final : public Game {
public:
    MyGame() : graphics_(this) {
        graphics_.setPreferMultiSamplingProperty(true);
        graphics_.setPreferredBackBufferWidthProperty(1280);
        graphics_.setPreferredBackBufferHeightProperty(720);
    }
    // ...
private:
    GraphicsDeviceManager graphics_;
};

The word "Prefer" in PreferMultiSampling is significant: if the hardware or driver does not support MSAA (or does not support the requested sample count), CNA will silently fall back to fewer samples, or none, rather than failing. Ask gd.SupportsCapability(CNA::GraphicsCapability::MultiSampleAntiAliasing) to learn whether the renderer can multisample at all, and read GraphicsDevice.PresentationParameters.MultiSampleCount to learn the count in use — but only trust that read-back on the renderers marked in the table below; on the others it simply echoes the request.

GraphicsDeviceManager Settings

GraphicsDeviceManager has no sample-count property of its own; PreferMultiSampling is the whole switch. When it is true the manager requests 8 samples, and when it is false it forces the count to 0. The renderer then clamps that request to what it supports (see the table under Renderer Support). To ask for a different count, set it on the PresentationParameters inside the PreparingDeviceSettings event, which runs after the manager has filled in its defaults and before the device is created:

graphics_.setPreferMultiSamplingProperty(true);

// Request 4x instead of the default 8. The renderer clamps the request to what the
// device supports, so the actual count may be lower.
// Useful values: 2, 4, 8 (1 is not a valid MSAA count and means "none").
// Most integrated GPUs support up to 4x; discrete GPUs support more on some APIs.
graphics_.PreparingDeviceSettings +=
    [](System::Object*, const PreparingDeviceSettingsEventArgs& e) {
        e.getGraphicsDeviceInformationEXT()
         .getPresentationParametersProperty()
         .setMultiSampleCountProperty(4);
    };

These settings can also be changed at runtime by calling GraphicsDeviceManager::ApplyChanges() after modifying them, which re-applies the presentation parameters to the device (an in-place reset). This is useful for an in-game graphics settings screen. An off-screen target takes its own count: RenderTarget2D(gd, w, h, false, SurfaceFormat::Color, DepthFormat::Depth24, 4) rounds the count down to a power of two (1 becomes 0), and every target in a multiple-render-target set must have the same applied sample count.

MultiSampleCount — Choosing a Level

On most modern dedicated GPUs, 4x MSAA is the sweet spot: it eliminates the vast majority of visible aliasing at roughly double the memory bandwidth of the unsampled case, which is well within the available bandwidth on current hardware. On integrated GPUs (Intel Iris, Apple M-series GPU, Mali, Adreno), 2x or no MSAA and FXAA as a substitute is often the better choice for maintaining 60 fps.

Verify the actual count after device creation:

void Initialize() override {
    Game::Initialize();
    auto& pp = getGraphicsDeviceProperty().getPresentationParametersProperty();
    // pp.getMultiSampleCountProperty() reports what the renderer actually applied
    // on the renderers marked "reports applied count" below; elsewhere it echoes
    // the request, so also consult SupportsCapability(MultiSampleAntiAliasing).
    int actualSamples = pp.getMultiSampleCountProperty();
    // Log to console, display in a debug overlay, etc.
    (void)actualSamples;
}

Renderer Support

• The GL family (internally EasyGL) — the request travels in the platform’s GL context description (multisampleSamples), which the SDL3 platform honours through SDL_GL_MULTISAMPLEBUFFERS/SDL_GL_MULTISAMPLESAMPLES. The achieved count is confirmed with glGetIntegerv(GL_SAMPLES, &actual) and reported back.
• The VULKAN renderer — keeps the swap chain images single-sample and renders into a separate multisampled colour and depth target (for example VK_SAMPLE_COUNT_4_BIT), which it resolves into the swap chain image. It uses vkGetPhysicalDeviceProperties to query framebufferColorSampleCounts and framebufferDepthSampleCounts for hardware limits.

Complete MSAA Example

class MsaaGame final : public Game {
public:
    MsaaGame() : graphics_(this) {
        // Prefer multisampling: the manager requests 8 samples and the renderer
        // clamps that to what it supports (use PreparingDeviceSettings for 4).
        graphics_.setPreferMultiSamplingProperty(true);
        graphics_.setPreferredBackBufferWidthProperty(1280);
        graphics_.setPreferredBackBufferHeightProperty(720);
    }

protected:
    void Initialize() override {
        Game::Initialize();

        // Confirm the MSAA level. This is the applied count on the renderers that
        // report it (see the table); elsewhere it echoes the request.
        auto& pp = getGraphicsDeviceProperty().getPresentationParametersProperty();
        actualSampleCount_ = pp.getMultiSampleCountProperty();
    }

    void LoadContent() override {
        auto& gd = getGraphicsDeviceProperty();
        effect_ = std::make_unique<BasicEffect>(gd);
        effect_->VertexColorEnabled = true;
        effect_->setLightingEnabledProperty(false);
        buildSpinningTriangle(gd);
    }

    void Update(GameTime& gt) override {
        angle_ += (float)gt.getElapsedGameTimeProperty().getTotalSecondsProperty() * 0.8f;
    }

    void Draw(const GameTime&) override {
        auto& gd = getGraphicsDeviceProperty();
        gd.Clear(Color::CornflowerBlue);

        // Rotate a coloured triangle to make aliasing visible
        Matrix world = Matrix::CreateRotationZ(angle_);
        effect_->setWorldProperty(world);
        effect_->setViewProperty(Matrix::CreateLookAt(
            Vector3(0.0f, 0.0f, 3.0f),
            Vector3::Zero,
            Vector3::Up));
        effect_->setProjectionProperty(Matrix::CreatePerspectiveFieldOfView(
            MathHelper::PiOver4,
            1280.0f / 720.0f,
            0.1f, 100.0f));

        gd.SetVertexBuffer(vb_.get());
        for (auto& pass : effect_->getCurrentTechniqueProperty()->getPassesProperty()) {
            pass.Apply();
            gd.DrawPrimitives(PrimitiveType::TriangleList, 0, triCount_);
        }
        // No gd.Present(): Game presents after Draw() returns.
    }

private:
    GraphicsDeviceManager         graphics_;
    std::unique_ptr<BasicEffect>  effect_;
    std::unique_ptr<VertexBuffer> vb_;
    float angle_           = 0.0f;
    int   triCount_        = 0;
    int   actualSampleCount_ = 1;

    void buildSpinningTriangle(GraphicsDevice& gd) {
        // A large triangle whose edges cross at steep angles
        // makes aliasing very visible when MSAA is off.
        VertexPositionColor verts[3] = {
            { Vector3( 0.0f,  1.5f, 0.0f), Color::Red   },
            { Vector3( 1.3f, -0.75f, 0.0f), Color::Green },
            { Vector3(-1.3f, -0.75f, 0.0f), Color::Blue  },
        };
        vb_ = std::make_unique<VertexBuffer>(gd,
            VertexPositionColor::getVertexDeclarationStatic(), 3, BufferUsage::WriteOnly);
        vb_->SetData(verts, 3);
        triCount_ = 1;
    }
};

int main() {
    MsaaGame game;
    game.Run();
    return 0;
}

Performance Tradeoff

MSAA's performance impact comes primarily from two sources:

• Memory bandwidth — the framebuffer and depth buffer are N times larger (N = sample count). On bandwidth-limited GPUs (integrated graphics, mobile) this can be the dominant cost.
• Fill rate — at triangle edges where multiple samples fall inside the triangle, the GPU must write multiple samples. In the worst case (thin triangles covering many edge pixels) this approaches the cost of SSAA. In practice, for typical scene geometry, the overhead is much lower because most pixels are fully covered or fully uncovered.

Fragment shader cost is generally not multiplied by the sample count — the shader runs once per pixel, not once per sample. This is the key architectural advantage of MSAA over SSAA.

On modern desktop discrete GPUs (NVIDIA, AMD, Intel Arc), 4x MSAA at 1080p typically adds 5–15% to frame time compared to no AA, making it essentially free for GPU-limited games at 1080p. At 4K, the absolute bandwidth cost is much higher and 2x MSAA or FXAA may be preferable.

FXAA: A Post-Process Alternative

Fast Approximate Anti-Aliasing (FXAA) is a screen-space post-processing technique that detects high-contrast edges in the final colour image and blurs them slightly. It runs as a single fullscreen fragment shader pass on the resolved (non-MSAA) framebuffer. Key properties:

• Works on any renderer that has render targets and executes a custom shader on a full-screen pass. SDL_RENDERER is not one of them: it has no programmable shader stage and throws on any custom SpriteBatch effect. The shader dialect is the renderer’s own (see Tutorial 59 for the table), and FNA3D and SOFTWARE report CustomEffects false; on METAL the pass must be written in Metal Shading Language and drawn through SpriteBatch, the only place Metal runs a custom effect.
• No additional memory for multi-sample buffers.
• Detects edges from colour contrast, so it can also smooth texture edges and alpha-tested geometry.
• Introduces a small amount of blurring on fine detail (e.g., text, thin lines) as a side effect.
• Quality is lower than 4x MSAA for hard geometric edges, but the performance cost is very low and constant.

To implement FXAA in CNA: render the scene to a RenderTarget2D, then apply the FXAA shader as a fullscreen pass to the back buffer using a SpriteBatch with a custom effect or with a fullscreen triangle + custom vertex buffer.

FXAA GLSL Shader

// Simplified FXAA — luma-based edge detection and blend
// Based on Timothy Lottes' FXAA 3.11 algorithm (simplified for clarity)
#version 300 es
precision highp float;

in vec2 v_texcoord;
uniform sampler2D u_screen;

out vec4 fragColor;

const float FXAA_REDUCE_MIN = 1.0 / 128.0;
const float FXAA_REDUCE_MUL = 1.0 / 8.0;
const float FXAA_SPAN_MAX   = 8.0;

// Convert RGB to perceptual luminance
float luma(vec3 rgb) {
    return dot(rgb, vec3(0.299, 0.587, 0.114));
}

vec3 fxaa(sampler2D tex, vec2 uv, vec2 texelSize) {
    // Sample the pixel and its four diagonal neighbours
    vec3 rgbNW = texture(tex, uv + vec2(-1.0, -1.0) * texelSize).rgb;
    vec3 rgbNE = texture(tex, uv + vec2( 1.0, -1.0) * texelSize).rgb;
    vec3 rgbSW = texture(tex, uv + vec2(-1.0,  1.0) * texelSize).rgb;
    vec3 rgbSE = texture(tex, uv + vec2( 1.0,  1.0) * texelSize).rgb;
    vec3 rgbM  = texture(tex, uv).rgb;

    float lumaNW = luma(rgbNW);
    float lumaNE = luma(rgbNE);
    float lumaSW = luma(rgbSW);
    float lumaSE = luma(rgbSE);
    float lumaM  = luma(rgbM);

    float lumaMin = min(lumaM, min(min(lumaNW, lumaNE), min(lumaSW, lumaSE)));
    float lumaMax = max(lumaM, max(max(lumaNW, lumaNE), max(lumaSW, lumaSE)));

    // Detect edge direction from luma gradient
    vec2 dir = vec2(
        -((lumaNW + lumaNE) - (lumaSW + lumaSE)),
         ((lumaNW + lumaSW) - (lumaNE + lumaSE)));

    float dirReduce = max(
        (lumaNW + lumaNE + lumaSW + lumaSE) * FXAA_REDUCE_MUL * 0.25,
        FXAA_REDUCE_MIN);
    float rcpDirMin = 1.0 / (min(abs(dir.x), abs(dir.y)) + dirReduce);

    dir = clamp(dir * rcpDirMin, vec2(-FXAA_SPAN_MAX), vec2(FXAA_SPAN_MAX))
          * texelSize;

    // Sample along the edge direction at two offsets
    vec3 rgbA = 0.5 * (
        texture(tex, uv + dir * (1.0 / 3.0 - 0.5)).rgb +
        texture(tex, uv + dir * (2.0 / 3.0 - 0.5)).rgb);
    vec3 rgbB = rgbA * 0.5 + 0.25 * (
        texture(tex, uv + dir * -0.5).rgb +
        texture(tex, uv + dir *  0.5).rgb);

    // Use the wider sample only if it does not cross outside the local range
    float lumaB = luma(rgbB);
    if (lumaB < lumaMin || lumaB > lumaMax)
        return rgbA;
    return rgbB;
}

void main() {
    vec2 texelSize = 1.0 / vec2(textureSize(u_screen, 0));
    fragColor = vec4(fxaa(u_screen, v_texcoord, texelSize), 1.0);
}

Applying FXAA in the Draw Loop

#include "Microsoft/Xna/Framework/Graphics/ShaderEffect.hpp"
#include "System/IO/File.hpp"

// In LoadContent:
// sceneRT_     = std::make_unique<RenderTarget2D>(...);
// spriteBatch_ = std::make_unique<SpriteBatch>(gd);
//
// fxaaEffect_ = std::make_unique<ShaderEffect>(
//     gd,
//     System::IO::File::ReadAllText("Content/effects/fxaa.vert.glsl"),
//     System::IO::File::ReadAllText("Content/effects/fxaa.frag.glsl"));
//
// // The constructor does not throw on a compile failure;
// // GetCompileErrorEXT() returns the compiler log.
// if (!fxaaEffect_->IsEffectValid()) { /* the shader did not compile */ }
//
// // u_screen reads texture unit 0, which is where SpriteBatch binds its texture.
// fxaaEffect_->Apply();
// fxaaEffect_->SetUniformInt("u_screen", 0);

void Draw(const GameTime&) override {
    auto& gd = getGraphicsDeviceProperty();

    // 1. Render scene to off-screen target
    gd.SetRenderTarget(sceneRT_.get());
    gd.Clear(Color::CornflowerBlue);
    drawScene(gd);

    // 2. Apply FXAA pass to the back buffer
    gd.SetRenderTarget(nullptr);
    gd.Clear(Color::Black);

    // Nothing to rebind per frame: SpriteBatch supplies the source texture on
    // unit 0, and the sampler's unit was set once in LoadContent().
    // The sampler, depth-stencil and rasterizer parameters are pointers.
    spriteBatch_->Begin(SpriteSortMode::Immediate,
                         BlendState::Opaque,
                         &SamplerState::LinearClamp,
                         nullptr, nullptr,
                         fxaaEffect_.get());
    spriteBatch_->Draw(*sceneRT_, Vector2::Zero, Color::White);
    spriteBatch_->End();
    // No gd.Present(): Game presents after Draw() returns.
}

Choosing Between MSAA and FXAA

In practice, many games ship with both: MSAA for the forward-rendered geometry pass, and FXAA or TAA applied as a final post-process to handle remaining aliasing from shading. CNA supports this combination — enable MSAA on the back buffer for the main pass, then optionally add an FXAA pass at the end of Draw (the Game presents afterwards) for residual aliasing in shaded regions.