Cocoon.js & Three.js : 성능 향상

Question

물리를 위해 box2Dweb를 사용하고 렌더링을 위해 three.js를 사용하여 기초적인 3D 게임을 개발했습니다. 그것은 기본적인 측면 스크롤러입니다. 나는 그것을 iOS에서 실행하고 싶습니다. iOS에서 WEBGL 사용을 허용하여 게임을 포장하기 위해 cocoon.js를 사용하기로 결정했습니다.

내가 겪고있는 문제는 성능입니다. 데스크톱 컴퓨터에서 게임은 초당 약 50 프레임으로 실행됩니다. iPhone 5에서는 초당 3 프레임의 물결이 일고 있습니다.

나는 게임을 벗겨 내고, 모든 텍스처를 제거하고, 쉐이더를 제거하고, 스카이 박스를 제거하고, 레벨을 줄였습니다 (카메라보기와 조금 뒤쪽과 앞에서 만). 이로 인해 성능이 25 % 향상되었습니다. 이제 4FPS로 실행 중입니다.

iOS 런처 앱과 함께 제공되는 데모를 보았는데 모두 원활하게 돌아갑니다.

성능을 향상시키기 위해 내가 할 수있는 유일한 또 다른 일은 성능 향상을 크게 줄 것이라고 생각하지 않는 JS를 축소하는 것입니다.

런처 앱에서 Accelerated Canvas/WebGL을 사용하고 있습니다. 나는 또한 캔버스 + 옵션, 같은 문제로 컴파일을 시도했다. cocoon.js와 three.js를의 성능을 개선하는 방법에 대한

this.renderer = new THREE.WebGLRenderer 

어떤 제안 : 나는 나는 three.js를에서 WebGL을 렌더러를 사용하고 three.js를 개정 67를 사용하고?

Answer 1

나는 프레임 속도를 최대 25fps까지 향상시켜 엄청난 발전을 이루었습니다.

object3d.castShadow = false; 

light.castShadow = false; 

renderer.shadowMapEnabled = false; 

내가 여러 광원을 사용 하였다

우선 모든 그림자를 캐스팅 된 객체에서뿐만 아니라 모든 광원에서뿐만 아니라 그림자 및 렌더링을 제거했습니다. 이것이 가장 큰 범인입니다. 나는 프레임 속도

다음에 엄청난 향상을 이루어 하나의 광원을 유지, 나는 나에게 FPS의 여분의 커플을 준 안개를 제거

나는 또한 약간을 줄 듯 자바 스크립트를 축소 된

성능 향상도

Answer 2

귀하의 문제를 해결해 주셔서 감사합니다.

게임의 성능을 향상시키는 데 주로 사용되는 '뒤쪽면 제거'를주의하지 않을 수 있습니다.

는 (렌더링되지 않습니다 보이지 않는 모든 다각형) 이 위키 링크는 설명 더 잘 http://en.wikipedia.org/wiki/Back-face_culling

또한 https://www.udacity.com/course/cs291

Three.js를 을 기반으로 물론이 큰 3D 그래픽을 복용하는 것이 좋습니다 것입니다