FFRK cocos2d xレイヤーの最適化

Copyright (C) DeNA Co.,Ltd. All Rights Reserved.

FINAL FANTASY Record Keeper cocos2d-x

Japan [email protected]


!

2002 etc

201310

cocos2d-x etc


FFRKKickmotor cocos2d-x


! cocos2d-x

! cocos2d-xGoogle

! http://www.cocos2d-x.org ! Github

https://github.com/cocos2d/cocos2d-x/tree/cocos2d-x-2.2.6


! Kickmotor

D.O.TDeNA

WebViewcocos2d-x

cocos2d-x

etc

http://www.slideshare.net/dena_study/20141111-seminar-eisuke http://www.slideshare.net/dena_study/20141111-dena-study21


! CBT

<

! WebViewcocos2d-x WebView cocos2d-x

! iPhone5S


(^o^)


C++

VV ^':::::::::::::::::::::::v l / , l..:.::::::::::::::::::::::::::::= = |.:::::::::::::::::::::::::::::: |= -= |:r--:::::|= = |:} _. }f' =-. -= l | /, , ,}`'``|:::|.|.. ., ,| , l|:}r . . |/ :-=-./| |.|:::::| ||/= =:.:.:: : | |.|:::::| | / . -=:.:::::::.,/.:::::| | /|= . -= :::::::::::.z.:| |' | =| |:::::::::::::::::::::::::::::::::::.|'.:Y/, | |::::::::::::::::::::::::::::::::::::__::| ', ./ | |:::::::::::::::::::::::::::::::::::.|::|. / / r|::::::::::::::::::::::::::::::::::::::::::::::::|

cocos2d-xC++


cocos2d-x

! cocos2d-x C++ cocos2d-x

!

!


orz


! CBT !

! ! iOSAndroid

iOSiPhone4S AndroidGalaxy S2Android2.3

! iOS Android


1. 2. XcodeInstruments 3. 4.

a) b) c)

5. 6. 1.


Xcode


Instruments Time Proler


! 0 ! ! ! OpenGL ES APIDrawCall ! ! CCNode ! cocos2d-x ! !


RGBA


20glClear()


!

! 20


OpenGL ES APIDrawCall


OpenGL ES APIDrawCall

cocos2d-xOpenGL


CCNode

CCNode::visit()

CCNode2000


CCNode::visit()

! Visiblevisit()

! OpenGL ! OpenGL ! visit() ! draw()


CCNode::visit() !

CCNode

CCSprite CCNode::onEnter()/CCNode::onExit()

! CCNode


cocos2d-x !

! MFC

! double cos()/sin()cosf()/sinf()

! ! D$

cocoa


!


!

FFRKX


!

CCNode::nodeToWorldTransform()

CCAffineTransform CCNode::nodeToWorldTransform() { CCAffineTransform t = this->nodeToParentTransform(); for (CCNode *p = m_pParent; p != NULL; p = p->getParent()) t = CCAffineTransformConcat(t, p->nodeToParentTransform()); return t; }


!


! AnimationBuilderCocosBuilder

RootCCNode CharactorsCCNode)

Char1CCNode CharIconCCSprite

CharStatusIconCCSprite GaugeBaseCCScale9Sprite

GaugeBarCCScale9Sprite

GaugeFrameCCScale9Sprite Char2CCNode


! CCSpriteBatchNode CCSpriteBatchNodeCCSprite

! 150 100


!

CCSpriteBatchNode


!

! OpenGL ES !


! MVP

uniform mat4 CC_MVPMatrix; aUribute vec4 a_posiWon; aUribute vec2 a_texCoord; aUribute vec4 a_color;

varying vec4 v_fragmentColor; varying vec2 v_texCoord;

void main() {

gl_PosiWon = CC_MVPMatrix * a_posiWon; v_fragmentColor = a_color; v_texCoord = a_texCoord;

}


! MVP MVP

//! Custom Vertex Data struct V3F_C4B_T2F_I1 { //! verWces (3F) ccVertex3F verWces; // 12 bytes //! colors (4B) ccColor4B colors; // 4 bytes //! tex coords (2F) ccTex2F texCoords; // 8 bytes //! matrix index oat matIdx; // 4 bytes };


! MVP

uniform mat4 CC_MVPMatrixArray[30]; aUribute vec4 a_posiWon; // V3F_C4B_T2F_I1::verWces aUribute vec2 a_texCoord; // V3F_C4B_T2F_I1::texCoords aUribute vec4 a_color; // V3F_C4B_T2F_I1::colors aUribute oat a_index; // V3F_C4B_T2F_I1::matIdx

arying vec4 v_fragmentColor; varying vec2 v_texCoord;

void main() { gl_PosiWon = CC_MVPMatrixArray[int(a_index)] * a_posiWon; v_fragmentColor = a_color; v_texCoord = a_texCoord; }


! CCSpriteCCSpriteBatchNode FFRKCCScale9Sprite

! CCSpriteCCSpriteBatchNode


! CCSprite::draw

CCSprite

MVP

! CCSpriteBatchNode::draw CCSpriteBatchNode

CCSprite MVP


319

Before

76 !

Aier


Before

Aier


Before

Aier

30FPS 60FPS


! FFRKcocos2d-x

5QA !

!

! ! !

! ()

Engineering

FFRK cocos2d xレイヤーの最適化