7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

1/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Lee Thomason | Flash Player Architect

GPUs in a Flash

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

2/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Mapping the Software Vector Renderer to the GPU

Brief Overview of Flash Rendering

A Journey of Technology and API

Deployment

2

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

3/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

The Problem

Todays web, but faster, mobile, and using less power.

Existing web?

New content for mobile?

Video?

3

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

4/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

The Flash Rendering Model

http://www.krazydad.com/bestiary/bestiary_yinyang.html

4

http://www.krazydad.com/bestiary/bestiary_yinyang.htmlhttp://www.krazydad.com/bestiary/bestiary_yinyang.html

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

5/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Anti-Aliasing

Software: clever 16x box filter (4x mobile)

Distinguishes coverage vs. transparency

High DPI good!

but no AA bad

MSAA

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

6/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Edge Abutment

One write per pixel. Not a painters algorithm.

Edges abut exactly

No light leaks

Renderer correctly distinguishes transparency and coverage

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

7/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

(Almost) Everything is Transparent

In practice so wildly common its hard to optimize for opaque cases.

Still one write per pixel.

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

8/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Quadratic Beziers

Odd choice from tooling perspective.

Handy for the runtime.

8

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

9/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Key renderer traits

Anti-aliased

Edge abutment

Transparency

Quadratic Beziers

9

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

10/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Please Note

Only sharing experiments with public tech.

Only showing prototype.

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

11/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Test Case

11

mudbubble.com

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

12/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Approach

Started with technology.

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

13/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Tessellation

Sweep

Seems straightforward.

Ugly edge cases

Bezier intersections

Floating point issues

Detail on one side impacts other side.

Stripey

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

14/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Stencil

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

15/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Stencil

15

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

16/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Stencil

16

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

17/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Stencil

17

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

18/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Stencil

18

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

19/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Stencil

Works for any closed path!

Simple

Fun optimization problems

Object or world space

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

20/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Stencil

20

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

21/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Stencil

21

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

22/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Stencil

22

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

23/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Implementation: OpenGL ES 1.1

Mobile first!

Stencil was optional. Never available in *any* HW we tested.

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

24/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Logic Ops

Clever abuse of the logic ops. XOR + DST Blend looks a lot like stencil.

Lots of edge cases (masking) hard to get right

Fill bound

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

25/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Next implementation: OpenVG

Coolest thing ever.

Prototype in a week!

We contributed changes to VG 1.1 to support Flash

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

26/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Flash Changes

Flash 10

Supports 2D shaders (PixelBender)

Future support for 3D

FlashLite

VG support shipping

26

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

27/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

OpenGL ES 2.0 Arrives!

Simple.

Consistent across our platforms.

Can be emulated on other APIs.

Basis for flat acceleration and 3D for foreseeable future.

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

28/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Implementation: OpenGL ES 2.0

The return of stencil

Shaders

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

29/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Fill rate

Always need more fill.

Content notorious for unseen objects.

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

30/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Tests

Depth is used for strokes.

Stencil is used for masking.

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

31/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Back to Tessellation

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

32/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Back but better!

2 stage approach

Convex pieces

Triangulation is adaptive

Spent time on edge cases

Integer coordinates

32

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

33/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Tessellation

Pros

Maps well to 3D cards, how games work

Lots of optimization room

Frees stencil

Uses less fill

Cons

Unusual (but real) content fail

Integer object space

Still want more fill

Working!

33

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

34/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Practicalities

Drivers. Drivers. Drivers.

OS support for GPUs.

Video integration. (Go Tegra!)

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

35/36

2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

Current Status

NVIDIA has been working closely with Adobe to optimize performance

and battery consumption

Tegra 2 is being built into multiple Android phones and tablets with a fully

accelerated Flash Player

35

7/28/2019 GPUs in a Flash - Mapping the Flash Animated Software Vector Rendering Model to the GPU

36/36

2010 Adobe Systems Incorporated All Rights Reserved Adobe Confidential