Innovations in high performance 2D graphics with DirectXDan McLachlanPrincipal Program Manager Lead Microsoft Corporation3-191

DirectX performance improvementsNew capabilities in Windows 8.1TextGeometryImaging

Agenda

DirectX technologies are core to Windows.

Performance demos

DirectX performance improvementsNew capabilities in Windows 8.1TextGeometryImaging

Agenda

Existing industry approachesApp does text analysis and replaces code points with bitmapsFont foundries provide multiple fonts that are aligned, and app draws same text in multiple fonts to get layeringFonts with embedded bitmaps

Multi-color fonts in Windows 8.1Supported through new multi-layer glyphsExtended the Windows OpenType implementationStill text, so everything else just works.New system font: Segoe UI EmojiSupports the most commonly used emoji code points

Color font demoDirectWrite / Direct2D

Enabling color – DrawTextLayout d2dContext->DrawTextLayout( D2D1::Point2F(x, y), m_layout.Get(), D2D1_DRAW_TEXT_OPTIONS_CLIP );

| D2D1_DRAW_TEXT_OPTIONS_ENABLE_COLOR_FONT

Enabling color - DrawGlyphRun

d2dContext->DrawGlyphRun(…, glyphRun, … color, …);

Enabling color - DrawGlyphRuncolorlayers = dWrite->TranslateColorGlyphRun(…, glyphRun, …); Foreach layer in colorLayers {

d2dContext->DrawGlyphRun(…, layer.GlyphRun, … layer.color, …); }

DirectX performance improvementsNew capabilities in Windows 8.1TextGeometryImaging

Agenda

2D geometry rendering performanceComplex geometry rendering CPU boundExisting optimization techniques have limitationsCreating bitmaps• Not fully robust to rotations and scales• Bitmaps consume significant resources

Geometry meshes• Only aliased rendering is available

Geometry Rendering SolutionsDirectX 11.1 hardware utilizationGeometry needs to be specified with D2D1_FILL_MODE_ALTERNATE

Geometry Realizations

Geometry realizationsNew Direct2D Geometry class Enables amortizing generation costs over multiple framesCreates device-dependent representationDrawing uses minimal CPU resourcesTuned for optimal GPU resource usage

Curve

Evaluatio

n

Tessellation

Antialiasing

Brushing

Draw or fill geometryOnce per frame

CPU Work

Geometry

Rendered on GPU

GPU Work

Create geometry realizationOnce per primitive

Geometry

Geometry Realization

Object

Curve

Evaluatio

n

Tessellation

CPU Work

Antialiasing

Brushing

Draw geometry realizationOnce per frame

Geometry Realization

Rendered on GPU

GPU Work

Will geometry realization work for you?Is your geometry static?Are the applied transformations only translations, rotations and uniform scales?

How you generate realizations will depend on your range of scale factors.

Geometry realizations demoDirect2D

DirectX performance improvementsNew capabilities in Windows 8.1TextGeometryImaging

Agenda

Improving image effects performanceDefer rasterization as much as possibleAvoid using a RenderTarget bitmap only onceCommandLists can be helpful when different sections of code generate intermediatesMinimize redundant rasterizationUse RenderTarget bitmaps when you need the same image as input to multiple effectsCommandLists are a tool here too

DirectX performance improvementsNew capabilities in Windows 8.1TextGeometryImaging• Image Compression

Agenda

Image considerations in appsLarge part of memory utilization and start up timeQuality versus space trade-offs

Direct2D supports two new compressed image formats

Jpeg image loading

Direct2Dbitmap

32bppPBGRApixel data

Inverse discrete cosine

transform and dequantization

Huffman decompression

Chroma upsampling

Color space conversion

(YCBCR -> RGB)

WIC Format convert

CompressedJPEG data

JPEGFile

Jpeg image loading using YCBCR data

8bppY (luma)pixel data

Direct2D YCBCR effect

16bppCBCR(chroma)pixel data

Direct2D bitmap

Direct2D bitmap

Inverse discrete cosine

transform and dequantization

Huffman decompression

Chroma upsampling

Color space conversion

(YCBCR -> RGB)

WIC Format convert

CompressedJPEG data

JPEGFile

Direct2Dbitmap

32bppPBGRApixel data

Comparison of image data for some common Windows 8 apps.

Analysis of memory usage

App JPEGs - RGBA JPEGs - YCBCR % Savings

Music 41.4 MB 15.5 MB 63%

Photos 36.3 MB 13.6 MB 63%

Weather 23.8 MB 17.8 MB 25%

News 66.2 MB 24.8 MB 63%

Block compression formatsNative graphics hardware support• BC1 – BC3 DirectX 9+ hardware• BC4 – BC5 DirectX 10+ hardware• BC6 – BC7 DirectX 11+ hardware

4-8 bits per pixelCan be up to 87.5 % smaller in memory than RGBALossy image compressionMUST be a multiple of 4 in all dimensions

Block compression

4x4 block

R

B

G

00

01

02

03

01 02 00 00

01 00 03 03

01 00 02 02

01 01 01 02

Color1 Color2 16 – 2bit encoded colorsEncoding

Choosing your Block compression format

Block compression

Source DataData Compression Resolution(in bits)

Format Bits / Pixel

Three-component color and alpha

Color (5:6:5), Alpha (1) or no alpha BC1 4

Three-component color and alpha Color (5:6:5), Alpha (4) BC2 8

Three-component color and alpha Color (5:6:5), Alpha (3*) BC3 8

Cut The Rope image comparisonStartbg.jpg (Background image)

Original BGRA format (7.91MB decoded)

Cut The Rope image comparisonStartbg.jpg (Background image)

BC1 compression (0.99MB decoded)

Jpeg to BC-1Jpeg version1

1Decoding does not include YCBCR optimizations

BC-1 version

Using block compressed imagesUse current authoring pipelineBlock compressed images are a runtime formatGenerate them as part of your app build/packaging

Visual assets(JPEG, PNG, etc)

DDS file(block compressed) Direct2D bitmapConvert

to DDSDirectly readblock data

Design time Run timeBuild time

How to use Block Compressed images (DDS)

Using image compressionJpeg YCBCR compression• User assets• No conversion necessary• 25% - 63% working set savings over RGBA data• Smaller disk footprint compared to DDSBlock compression (DDS)• App-local assets• Build time conversion• Better with natural images than synthetic ones• 75% - 87.5% working set savings over RGBA data

DirectX performance improvementsNew capabilities in Windows 8.1TextGeometryImaging

Summary

Leverage new Windows 8.1 features to make your apps fast and fluid

Call to action Use new color fonts for emoticons AND scalable UI elements Take advantage of Geometry Realizations to improve geometry rendering performanceUse compressed image formats and maintain compression on GPU for faster load times and better resource utilization

ResourcesColor Fonts SampleGeometry Realization SampleD2D1_FILL_MODE enumerationBlock Compressed Images SampleJPEG YCBCR Optimizations SampleBlock Compression (MSDN).

Other related talks Title Session IDBuilding Games for Windows 2-047What’s new in Direct3D 11.2 3-062Massive virtual textures for games: Direct3D and Tiled Resources 4-063DirectX Graphics Debugging Tools 3-141Bringing Desktop PC Games to the Windows Store 3-190Tales from the Trenches: Developing “The Harvest” and “Gunpowder” with Unity 3-044Accelerating Windows Store Game Development with Middleware 3-187Bringing Halo: Spartan Assault to Windows tablets and mobile devices 2-049From Android or iOS: Bringing Your OpenGL ES Game to the Windows Store 3-189Cutting Edge Games on Windows Tablets 3-043Play Together! Leaderboards with Windows Azure and Multiplayer with WiFi Direct 3-051

Evaluate this session

Scan this QR code to evaluate this session and be automatically entered in a drawing to win a prize!

© 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.