Rendering in background

Help & Support
1

Hello.
The size of my scene is about from 150mb to 200mb and you can give or take.

What I want to do is give better user experience by which a user don’t have to wait for a long time to load all the scene.

To do that, I set up several steps to actually visit and load the scene.
While the user goes through several pages, it loads all the assets and run it in background.

My first try is set ‘display’ as none for the wrapping div.
The second try is locating the wapping div to the outside of the screen( position: absolute, top:-100%, left:-100%)

In both scenario, it shows little enhancement in loading performance, but not that dramatically enhanced.

What I assume is that as long as it’s not visible to the screen it is not rendered.
If my guess is true,
I just wonder if there is a way making it renders by force even though it’s not visible?

2

Hi @sooyong_Kim,

That’s strange, I’d have assumed that the CSS used it shouldn’t matter.

As an alternative can you try this style rule instead:

opacity: 0.0;
1 Like
3

Load the PlayCanvas scene or load the web page? If loading the scene, there’s several steps in the process:

  • Downloading the assets (150MB to 200MB is A LOT. Are you sure you want the user to download this much at once? How much is needed for the first part of the experience)
  • The size of the scene itself (how many entities, components in the scene hierarchy?)
  • The first frame code calls (what are you doing in intialize, post initialize and the first update?)

There are ways to mitigate this (some of which we’ve detailed here Optimizing Load Time | Learn PlayCanvas)

2 Likes