微信小游戏开发（9）- 分包加载

随着小游戏的玩法越来越丰富，开发者对于扩大包大小的需求越来越强烈，所以微信推出了小游戏分包加载这一个功能。

所谓的分包加载，即把游戏内容按照一定的规则拆分成几个包，在首次启动时先下载必要的包，这个必要的包我们称为【主包】，开发者可以在主包内触发其他分包的下载，从而把首次下载的耗时分散到游戏运行中。

分包加载包大小限制

目前小游戏分包大小有如下限制：

整个小游戏所有包大小不超过8M
单个分包/主包大小不能超过4M

分包配置

需要在game.json中配置分包信息。假设游戏的目录结构如下：

|----game.js
|----game.json
|----images
|    |----a.png
|    |----b.png
|----stage1
|    |----game.js
|    |----images
|         |----1.png
|         |----2.png
|----stage2.js
复制代码

我们将stage1文件夹作为一个分包，把stage2.js作为一个分包，那么在game.json中的配置为：

{
    “subpackages”: [
        {
            “name”: “stage1”,
            “root”: “stage1”  //可指定一个目录，根目录下game.js会作为入口文件，目录下所有资源将会统一打包
        }, 
        {
            “name”: “stage2”,
            “root”: “stage2.js” //也可以指定一个JS文件
        }
    ]
}
复制代码

配置在subpackages中的目录或js文件，将按照配置打包成一个个【分包】，没有配置在subpackages中的目录或者js，将会被打包到主包中。

分包加载

微信提供了wx.loadSubpackage() API来触发分包的下载，调用wx.loadSubpackage后，将触发分包的下载与加载。

在加载完成之后，通过wx.loadSubpackage的success函数来通知加载完成。

同时，wx.loadSubpackage会返回一个LoadSubpackageTask，可以通过LoadSubpackageTask获取当前下载进度。

示例代码：

const loadTask = wx.loadSubpackage({
    name: 'stage1', // name可以填为name或者root
    success: function(res){
        // 分包加载完成后通过success回调 
    },
    fail: function(res){
        // 分包加载失败通过fail回调
    }
})

loadTask.onProgressUpdate(res => {
    console.log('下载速度',res.progress);
    console.log('已经下载的数据长度',res.totalBytesWritten);
    console.log('预期需要下载的数据总长度', res.totalBytesExpectedToWrite)
})
复制代码

老版本兼容

由微信后台编译来处理旧版本客户端的兼容，后台会编译两份代码包，一份是分包后代码，另一份是整包的兼容代码。对于老客户端，会去下载整包代码启动。

开发者在基础库2.1.0以下版本不需要调用wx.loadSubpackage触发加载，因为2.1.0以下版本不存在wx.loadSubpackage方法。

老版本下，需要开发者调用require触发分包入口文件的加载。例如：

require(‘stage1/game.js’)
复制代码

如果不打算兼容老版本，开发者可以通过mp小游戏后台配置端屏蔽2.1.0以下基础版的用户。

已知BUG

目前Android无法加载分包下的字体文件，预计会在下个客户端版本中修复。

本节内容就为大家介绍到这里，下节将为大家介绍小游戏音频播放的相关内容。

学习是一条令人时而喜极而泣，时而郁郁寡欢的道路。如果您觉得这篇文章对您有所帮助，请您酌情赞赏！