Best ways to handle GUI and gameplay


I am working making games for 512 MB ram Mobile phone targeted html5 games.

Whats the best way of handling this.

  1. With what i know of Playcanvas … as i have been on it only from 10-15 days… We have to keep GUI screens as entities and work with enabling and disabling them based on the game state.

If i do this, all the entities would be loaded and along with it gameplay assets… physics calculations may get affected.

Whats the best way of handling GUI with gameplay…

Also, say we have 25 levels in the game, If i keep all level design in the same scene with each Level as an Entity parent, this also may affect.

  1. So may be, If i keep Menu handling in a different scene and pass the value based on level selection to the gameplay scene, then this may help. But we have to keep 25-30 scenes… is this ok?

Also please let me know how do we pass data from one scene to another

Hi @Ajit.

So right now there are few ways you can go. If you do really need GUI rendered in WebGL, then yes, you need a scene data for it. But not sure you want any physics on it. So technically entities are very lightweight and don’t cost much RAM or CPU. It is more imagery that will consume your RAM on mobile.

You could make UI using DOM as well, I prefer it that way, but it is up to you guys.

Regarding levels. There is currently multi-scene system, but you will have to get used to the way it works.
You definitely want to keep levels as separately loadable hierarchy pieces. So if you simply load separate JSON, you can parse it into entities:

var parser = new pc.SceneParser(;
var parent = parser.parse(data);

This will return you a parent, root node of that scene. To load JSON of scene, you need to know where it is located, which you can find using Network profiler in Dev Tools. It will be something like ID.json, where ID - is ID of a scene. Which you can find in URL in Editor when Editing that specific scene.
I know, it could be a better workflow for this.

There is actually an idea that been long around, which is Async Hierarchy - that would allow to mark specific entity as being Async, and it would not load it if it is disabled, and load it once it is enabled or called by special component.