Sergey Gonchar - Fast rendering with Starling
-
Upload
flash-conference -
Category
Engineering
-
view
1.133 -
download
1
Transcript of Sergey Gonchar - Fast rendering with Starling
![Page 2: Sergey Gonchar - Fast rendering with Starling](https://reader033.fdocuments.us/reader033/viewer/2022061307/5882069d1a28abf05e8b5b83/html5/thumbnails/2.jpg)
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](https://reader033.fdocuments.us/reader033/viewer/2022061307/5882069d1a28abf05e8b5b83/html5/thumbnails/3.jpg)
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](https://reader033.fdocuments.us/reader033/viewer/2022061307/5882069d1a28abf05e8b5b83/html5/thumbnails/4.jpg)
Context3D profiles
• BASELINE_CONSTRAINED for web - windows
• BASELINE for web - mac
• MAX PROFILE for mobile
![Page 5: Sergey Gonchar - Fast rendering with Starling](https://reader033.fdocuments.us/reader033/viewer/2022061307/5882069d1a28abf05e8b5b83/html5/thumbnails/5.jpg)
![Page 6: Sergey Gonchar - Fast rendering with Starling](https://reader033.fdocuments.us/reader033/viewer/2022061307/5882069d1a28abf05e8b5b83/html5/thumbnails/6.jpg)
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](https://reader033.fdocuments.us/reader033/viewer/2022061307/5882069d1a28abf05e8b5b83/html5/thumbnails/7.jpg)
http://gamua.com/starling/
![Page 8: Sergey Gonchar - Fast rendering with Starling](https://reader033.fdocuments.us/reader033/viewer/2022061307/5882069d1a28abf05e8b5b83/html5/thumbnails/8.jpg)
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](https://reader033.fdocuments.us/reader033/viewer/2022061307/5882069d1a28abf05e8b5b83/html5/thumbnails/9.jpg)
![Page 10: Sergey Gonchar - Fast rendering with Starling](https://reader033.fdocuments.us/reader033/viewer/2022061307/5882069d1a28abf05e8b5b83/html5/thumbnails/10.jpg)
Starling VertexBufferDescr
• va0 - x,y
• va1 - r,g,b,a
• va2 - u,v
![Page 11: Sergey Gonchar - Fast rendering with Starling](https://reader033.fdocuments.us/reader033/viewer/2022061307/5882069d1a28abf05e8b5b83/html5/thumbnails/11.jpg)
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](https://reader033.fdocuments.us/reader033/viewer/2022061307/5882069d1a28abf05e8b5b83/html5/thumbnails/12.jpg)
New VertexBufferDescr
• va0 - x,y,index
![Page 13: Sergey Gonchar - Fast rendering with Starling](https://reader033.fdocuments.us/reader033/viewer/2022061307/5882069d1a28abf05e8b5b83/html5/thumbnails/13.jpg)
How does it work?
![Page 14: Sergey Gonchar - Fast rendering with Starling](https://reader033.fdocuments.us/reader033/viewer/2022061307/5882069d1a28abf05e8b5b83/html5/thumbnails/14.jpg)
![Page 15: Sergey Gonchar - Fast rendering with Starling](https://reader033.fdocuments.us/reader033/viewer/2022061307/5882069d1a28abf05e8b5b83/html5/thumbnails/15.jpg)
![Page 16: Sergey Gonchar - Fast rendering with Starling](https://reader033.fdocuments.us/reader033/viewer/2022061307/5882069d1a28abf05e8b5b83/html5/thumbnails/16.jpg)
![Page 17: Sergey Gonchar - Fast rendering with Starling](https://reader033.fdocuments.us/reader033/viewer/2022061307/5882069d1a28abf05e8b5b83/html5/thumbnails/17.jpg)
![Page 18: Sergey Gonchar - Fast rendering with Starling](https://reader033.fdocuments.us/reader033/viewer/2022061307/5882069d1a28abf05e8b5b83/html5/thumbnails/18.jpg)
![Page 19: Sergey Gonchar - Fast rendering with Starling](https://reader033.fdocuments.us/reader033/viewer/2022061307/5882069d1a28abf05e8b5b83/html5/thumbnails/19.jpg)
![Page 20: Sergey Gonchar - Fast rendering with Starling](https://reader033.fdocuments.us/reader033/viewer/2022061307/5882069d1a28abf05e8b5b83/html5/thumbnails/20.jpg)
![Page 21: Sergey Gonchar - Fast rendering with Starling](https://reader033.fdocuments.us/reader033/viewer/2022061307/5882069d1a28abf05e8b5b83/html5/thumbnails/21.jpg)
![Page 22: Sergey Gonchar - Fast rendering with Starling](https://reader033.fdocuments.us/reader033/viewer/2022061307/5882069d1a28abf05e8b5b83/html5/thumbnails/22.jpg)
![Page 23: Sergey Gonchar - Fast rendering with Starling](https://reader033.fdocuments.us/reader033/viewer/2022061307/5882069d1a28abf05e8b5b83/html5/thumbnails/23.jpg)
![Page 24: Sergey Gonchar - Fast rendering with Starling](https://reader033.fdocuments.us/reader033/viewer/2022061307/5882069d1a28abf05e8b5b83/html5/thumbnails/24.jpg)
PixelPerfect Touch CPU Approach
• hitTest Quads
• hitTest texture
• repeat until find
![Page 25: Sergey Gonchar - Fast rendering with Starling](https://reader033.fdocuments.us/reader033/viewer/2022061307/5882069d1a28abf05e8b5b83/html5/thumbnails/25.jpg)
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](https://reader033.fdocuments.us/reader033/viewer/2022061307/5882069d1a28abf05e8b5b83/html5/thumbnails/26.jpg)
Scene
![Page 27: Sergey Gonchar - Fast rendering with Starling](https://reader033.fdocuments.us/reader033/viewer/2022061307/5882069d1a28abf05e8b5b83/html5/thumbnails/27.jpg)
Touch test
![Page 28: Sergey Gonchar - Fast rendering with Starling](https://reader033.fdocuments.us/reader033/viewer/2022061307/5882069d1a28abf05e8b5b83/html5/thumbnails/28.jpg)
Books
http://www.amazon.com/Practical-Rendering-Computation-Direct3D-11/dp/1568817207
http://www.amazon.com/Adobe-Stage3D-Molehill-Programming-Beginners/dp/1849691681
![Page 29: Sergey Gonchar - Fast rendering with Starling](https://reader033.fdocuments.us/reader033/viewer/2022061307/5882069d1a28abf05e8b5b83/html5/thumbnails/29.jpg)
Thank you!
• Blog http://gonchar.me/
• Follow me http://twitter.com/UnknownFlasher
• Stage3D http://facebook.com/groups/stage3d
• FlashDaily http://flashdaily.net