There is a very important function in the resource management module: Asset Bundle. So what is Asset Bundle? what's the effect? How to use Asset Bundle?
1. What is Asset Bundle? what's the effect?
In the daily game development process, in order to reduce the time for first downloading and loading resources when the game is started, we can only download and load the required resource modules.
The Asset Bundle in CocosCreator is such a modular tool that allows us to divide resources such as pictures, scripts, scenes, etc. into multiple different Asset Bundles according to project needs.
For example: a lobby integrates many mini-games, and we can divide the lobby and different mini-games into different Asset Bundles for management.
Asset Bundle can be placed in different places, such as on a remote server, locally, or in a sub-package of a mini-game platform.
2. CocosCreator built-in Asset Bundle
Built-in Asset Bundle | Function Description | Configuration | priority |
---|---|---|---|
main |
Stores all the scenarios checked in the Participating Build Scenarios in the Build Release panel and their dependent resources | Configure the main package compression type of the build release panel and configure the main package as a remote package. | 7 |
resources |
Store resources all resources in the directory and their dependent resources |
By configuring the folder in Explorerassets -> resources |
8 |
start-scene |
If initial scene subcontracting is checked in the Build Release panel , the first scene will be built into .start-scene |
Unable to configure | 20 |
internal |
Some default resources built into the engine module | Unable to configure | 21 |
3. Basic use of Asset Bundle
1. Asset Bundle configuration
Customized Asset Bundles are configured in units of folders . You can click the Edit button on the Property Inspector or open the project settings through the Project menu to configure the Bundle.
Configuration item description
Configuration items | Function Description |
---|---|
Bundle name | The name of the Asset Bundle after construction will use the name of this folder by default and can be modified as needed. |
Bundle priority | Creator has opened 20 configurable priorities. When building, the Asset Bundle will be built in order from large to small priorities. |
target platform | Different platforms can use different configurations. When building, the Asset Bundle will be built according to the settings of the corresponding platform. Supports selecting different platform configurations through the drop-down box, which is currently the default configuration. Developers can customize their own configuration scheme through Project Settings- > Bundle Configuration . |
Compression type | Determines the final output form of Asset Bundle, including 5 compression types: merge dependencies , no compression , merge all JSON , mini-game sub-packaging , and Zip . |
Configure as remote package | Whether to configure the Asset Bundle as a remote package, the Web platform is not supported. If this option is checked, the Asset Bundle will be placed in the remote folder after being built . You need to put the entire remote folder on the remote server. When building small game platforms such as OPPO, vivo, Huawei, etc., if this option is checked, the Asset Bundle will not be packaged into rpk. |
Bundle resource filtering | Resource filtering can filter out certain resources in the Bundle. Through the preview button below, you can view the final resource list of the Bundle. Bundle filtering is divided into two parts: inclusion and exclusion. |
Build Bundle | Building Bundle can build the currently selected Bundle. |
(1) Description of Bundle priority rules
-
When the same resource is referenced by multiple Asset Bundles with different priorities , the resource will be placed first in the Asset Bundle with higher priority, and only one record information will be stored in the Asset Bundle with lower priority. At this time, the low-priority Asset Bundle will depend on the high-priority Asset Bundle.
If you want to load this shared resource in a low-priority Asset Bundle, you must load the high-priority Asset Bundle before loading the low-priority Asset Bundle.
-
When the same resource is referenced by multiple Asset Bundles with the same priority , the resource will be copied in each Asset Bundle. At this time, there is no dependency between different Asset Bundles and they can be loaded in any order. Therefore, it is necessary to try to ensure that the Asset Bundle where the
shared resources (such asTexture
,SpriteFrame
, etc.) are located has a higher priority, so that more low-priority Asset Bundles can share resources, thereby minimizing the package body.Audio
-
The custom Asset Bundle should not have a higher priority than the built-in Asset Bundle, so that resources in the built-in Asset Bundle can be shared as much as possible.
(2) Description of compression type
Asset Bundle uses the merged dependency compression type by default. You can reset the compression type of all Asset Bundles including built-in Asset Bundles by turning it on.
Compression type | Function Description |
---|---|
Merge dependencies | When building an Asset Bundle, JSON files of interdependent resources will be merged together to reduce the number of load requests at runtime. |
No compression | Asset Bundle is built without any compression |
Merge all JSON | When building an Asset Bundle, the JSON files of all resources will be merged into one, thereby minimizing the number of requests, but may increase the loading time of a single resource. |
Mini game subcontracting | On mini-game platforms that provide sub-packaging functionality, the Asset Bundle will be set to sub-packaging on the corresponding platform. |
Zip | On some mini-game platforms, when building an Asset Bundle, the resource files will be compressed into a Zip file, thereby reducing the number of loading requests at runtime. |
(3), Bundle resource filtering
Resource filtering can include or exclude certain resources in the selected Bundle from the Bundle.
Filter type
There are currently two filtering types, Asset resources and URLs . Defaults to URL .
2. Construction of Asset Bundle
When building, the resources in the folder configured as Asset Bundle (including scenes, code, and other resources) and related dependent resources outside the folder will be merged into the same Asset Bundle folder. All code and resources
in the folder configured as Asset Bundle will be processed as follows:
-
Code : All codes in the folder will be combined into one
index.js
orgame.js
entry script file according to the publishing platform. -
Resources : All resources in the folder and related dependent resources outside the folder will be placed in the
import
or directory.native
-
Resource configuration : All resource configuration information including path, type, and version information will be merged into one
config.json
file.
For example:
3. Asset Bundle loading
(1) Loading by name
CocosCreator provides a unified API to load Asset Bundle. When loading, you need to pass in the Bundle nameassetManager.loadBundle
in the Asset Bundle configuration panel or the URL of the Asset Bundle .
assetManager.loadBundle('name', (err, bundle) => {
bundle.load('xxx');
});
(2) Loading through url
When reusing Asset Bundles from other projects, they can only be loaded through the URL :
assetManager.loadBundle('https://test.com/remote/name', (err, bundle) => {
bundle.load('xxx');
});
(3) Loading through the user space path
assetManager.loadBundle
It also supports passing the path in user space to load the Asset Bundle.
We can download the Asset Bundle to the user space in advance through the download interface provided by the corresponding platform, and then use to loadBundle
load it. In this way, we can completely manage the download and caching process of the Asset Bundle by ourselves, making it more flexible to use.
// 原生平台
assetManager.loadBundle(jsb.fileUtils.getWritablePath() + '/path/bundleName', (err, bundle) => {
// ...
});
// 微信小游戏平台
assetManager.loadBundle(wx.env.USER_DATA_PATH + '/path/bundleName', (err, bundle) => {
// ...
});
4. Load the resources in the Asset Bundle
(1), normal loading
After the Asset Bundle is loaded, an AssetManager.Bundle
instance of the class will be returned.
load
We can load the resources in the Asset Bundle through the method on the instance . The parameters of this method are resources.load
the same as the method. We only need to pass in the path of the resource relative to the Asset Bundle.
Note: the file extension cannot be included at the end of the path.
// 加载 Texture
bundle.load(`image/texture`, Texture2D, function (err, texture) {
console.log(texture)
});
(2) Load resources in batches
Loading resources in batches is resources.loadDir
similar to , you only need to pass in the path of the directory relative to the Asset Bundle.
bundle.loadDir("textures", function (err, assets) {
// ...
});
(3), load scene
Loading Scenes Asset Bundle provides loadScene
the method for loading scenes in the specified bundle. You only need to pass in the scene name . The difference from is that it
loadScene
will only load the scene in the specified bundle, but will not run the scene. You also need to use to run the scene:director.loadScene
loadScene
director.runScene
bundle.loadScene('test', function (err, scene) {
director.runScene(scene);
});
(4), preload resources
Asset Bundle provides preload
and preloadDir
interfaces for preloading resources in Asset Bundle. The specific usage is assetManager
consistent with .
5. Get Asset Bundle
When the Asset Bundle is loaded, it will be cached. You can use the Asset Bundle name to obtain the bundle. For example:
let bundle = assetManager.getBundle('name');
6. Release the resources in the Asset Bundle
Release can be done in three ways:
assetManager.releaseAsset
Release using normal methods.
bundle.load(`image/spriteFrame`, SpriteFrame, function (err, spriteFrame) {
assetManager.releaseAsset(spriteFrame);
});
- Use the method provided by Asset Bundle
release
to release by passing in the path and type. Only a single resource in the Asset Bundle can be released.load
The parameters can be the same as those used in the Asset Bundle method.
bundle.load(`image/spriteFrame`, SpriteFrame, function (err, spriteFrame) {
bundle.release(`image`, SpriteFrame);
});
- Use the method provided by Asset Bundle
releaseAll
. This method isassetManager.releaseAll
similar to andreleaseAll
will release all resources belonging to the bundle (including resources in the Asset Bundle and its external dependent resources). Please use it with caution.
bundle.load(`image/spriteFrame`, SpriteFrame, function (err, spriteFrame) {
bundle.releaseAll();
});