sergey gonchar - fast rendering with starling

29
Fast rendering with Starling BAFPUG 2015 Sergey Gonchar http://gonchar.me

Upload: flash-conference

Post on 14-Apr-2017

1.133 views

Category:

Engineering


1 download

TRANSCRIPT

Page 1: Sergey Gonchar - Fast rendering with Starling

Fast rendering with Starling

BAFPUG 2015

Sergey Gonchar http://gonchar.me

Page 2: Sergey Gonchar - Fast rendering with Starling

Stage3D API• Since 2011 (Flash Player 11)

• Unified API for managing texture memory, vertex shading, pixel shading, and mesh rendering

• Transparently executed using OpenGL and DirectX

Page 3: Sergey Gonchar - Fast rendering with Starling

Each frame

— clear backbuffer by calling Context3D.clear— set gpu state through Context3D API— call drawTriangles()— repeat until the scene is entirely rendered— call the present() method to display the rendered

scene on the stage. It copies the backbuffer to a framebuffer

Page 4: Sergey Gonchar - Fast rendering with Starling

Context3D profiles

• BASELINE_CONSTRAINED for web - windows

• BASELINE for web - mac

• MAX PROFILE for mobile

Page 5: Sergey Gonchar - Fast rendering with Starling
Page 6: Sergey Gonchar - Fast rendering with Starling

Profiling Tools• Adobe Scout

https://creative.adobe.com/ru/products/scout

• Intel GPA https://software.intel.com/en-us/gpa

• Xcode OpenGL Tools https://developer.apple.com/opengl/

• RenderDoc http://cryengine.com/renderdoc

Page 7: Sergey Gonchar - Fast rendering with Starling

http://gamua.com/starling/

Page 8: Sergey Gonchar - Fast rendering with Starling

How does QuadBatch work?

• Collects quads with the same state(same texture, blendMode, shader)

• Transforms all vertices to one space and upload to VertexBuffer

• Render

Page 9: Sergey Gonchar - Fast rendering with Starling
Page 10: Sergey Gonchar - Fast rendering with Starling

Starling VertexBufferDescr

• va0 - x,y

• va1 - r,g,b,a

• va2 - u,v

Page 11: Sergey Gonchar - Fast rendering with Starling

Constants approach• Create one common vertexBuffer during

application init, upload data once

• Batch quads and images by the same state and set program constants array(x,y,width,height,uv,tintcolor,rotation)

• Render

Page 12: Sergey Gonchar - Fast rendering with Starling

New VertexBufferDescr

• va0 - x,y,index

Page 13: Sergey Gonchar - Fast rendering with Starling

How does it work?

Page 14: Sergey Gonchar - Fast rendering with Starling
Page 15: Sergey Gonchar - Fast rendering with Starling
Page 16: Sergey Gonchar - Fast rendering with Starling
Page 17: Sergey Gonchar - Fast rendering with Starling
Page 18: Sergey Gonchar - Fast rendering with Starling
Page 19: Sergey Gonchar - Fast rendering with Starling
Page 20: Sergey Gonchar - Fast rendering with Starling
Page 21: Sergey Gonchar - Fast rendering with Starling
Page 22: Sergey Gonchar - Fast rendering with Starling
Page 23: Sergey Gonchar - Fast rendering with Starling
Page 24: Sergey Gonchar - Fast rendering with Starling

PixelPerfect Touch CPU Approach

• hitTest Quads

• hitTest texture

• repeat until find

Page 25: Sergey Gonchar - Fast rendering with Starling

PixelPerfect Touch GPU!

• Use simple shader which renders images with single color

• Optimization: collect candidates by bounds

• Render targets to 1x1 texture on desktop or 4x4 texture on mobile

• Read back & sample color from texture

Page 26: Sergey Gonchar - Fast rendering with Starling

Scene

Page 27: Sergey Gonchar - Fast rendering with Starling

Touch test

Page 29: Sergey Gonchar - Fast rendering with Starling

Thank you!

• Blog http://gonchar.me/

• Follow me http://twitter.com/UnknownFlasher

• Stage3D http://facebook.com/groups/stage3d

• FlashDaily http://flashdaily.net