Loading a scene separately

Is there an easy way to load all the assets required to render a given scene, not during the initial loading sequence but manually firing in code a load function?

I did some research and it seems that the AssetRegistry is what I need to use in this case as described here:

However, the way it is described there I would have to manually create a list of every single asset used in a scene (models, materials, textures, scripts…) for every separate scene that I want to load dynamically, which is quite some work that I guess could be easily automated if I could access the list of assets a given scene is using.

Is there a direct way to do this?

Thanks for your help in advance :slight_smile:

Hi @mariogarranz,

That’s a good question, but I think there isn’t a direct way, like an API call to get a list of a scene’s assets. Maybe a good feature request for the engine repo!

That would involve iterating the hierarchy and finding all referenced assets per asset type. Which is indeed useful when doing async loading of assets and you would like to prepare a scene in advance before executing code.

1 Like

The current alternative is to tag the assets needed for a scene and use the asset registry to find the assets by tag and load them manually.

2 Likes

OK, thanks for your suggestions! :slight_smile:

I think this would be a valuable feature, indeed, but in the meantime tagging assets seems to be the solution that would work best for me.

1 Like

By the way I don’t see any direct method to determine the loading progress in te AssetRegistry, so am I correct to assume I would have to build something to track this myself?

You can track the moment when each asset becomes available using the ready event.

var asset = this.app.assets.find("My Asset");
asset.ready(function (asset) {
  // asset loaded
});
this.app.assets.load(asset);

You can use the javascript Promise.all handler to create promises and track the instance when all assets become available:

1 Like

Yeah that’s what I meant.

I come from a background coding in Phaser and Phaser has a Loader class that’s very flexible in that sense, you can add a list of assets to load, start it, stop it, receive a progress value, etc. so I was wondering if there was something similar here, but I guess I have to manually handle all those things.

Thanks! :slight_smile:

Good point, you can take a look at how the Playcanvas launcher works (the __start__.js and __loading__.js scripts), when you export and download a build from the editor.

Potentially you may be able to use the app.preload() method which will scan your assets and load the ones that have the preload flag set to true. So you could filter your assets manually, set preload to true and run preload().

While running it fires specific events when there is progress (asset loaded) and also when all the assets have finished loading.

    app.on('preload:end', function () {
        app.off('preload:progress');
    });
    app.on('preload:progress', setProgress);
    app.on('start', hideSplash);
1 Like

If you have a reference to the asset, you can also poll the asset via the loaded property to see if it’s ready. It currently doesn’t track how much of it’s downloaded so far though

1 Like

Thanks!

One last question, is there any way to stop a load? I would like to start loading some scenes in the background while the player is in the menu screen so maybe they are already loaded when they enter that scene, but it could happen that the player chooses a different scene. If this is the case then I would like to halt the previous load and focus directly on loading the requested scene assets.

Good question! I have to check if calling unload will do it :thinking:

2 Likes