Sunday, April 2, 2017

Three.js Scene Switching Performance Issue

Leave a Comment

I have created a game in three.js which exists of 3 scenes the GameScene, MenuScene and the HighScoreScene. The user can switch between those scenes - When the player is changing the Scene e.g. from the MenuScene to the HighScoreScene I'm trying to clean up the resources from the old Scene.

But cleaning up the resources seems not to work. So here is my code which is getting executed when the user is switching between scenes:

So in the old Scene I have this animation loop:

 function cancelAnimation() {     cancelAnimationFrame(animationFrameId); // EXECUTING WHEN SWITCHING SCENE!!!  }  function animate() {     animationFrameId = requestAnimationFrame(animate); // Saving id     render(); }  function render() {     renderer.clear();     renderer.render(scene, camera); } 

So when switching the scene I unset all click listeners and I'm calling cancelAnimation.

Because I'm storing that code for each Scene in an object like var menuScene = new MenuScene() I'm also doing this menuScene = undefined when switching the scene.

I'm also passing the same instance of var renderer = new THREE.WebGLRenderer(); to the scenes.

This all seems not to help the game is executing more slowly.

What is the proper way to switch between those scenes and clearing up the resources? What am I doing wrong here?

0 Answers

If You Enjoyed This, Take 5 Seconds To Share It

0 comments:

Post a Comment