微信小遊戲開發(9)- 分包載入

陳田田發表於2018-08-31

隨著小遊戲的玩法越來越豐富,開發者對於擴大包大小的需求越來越強烈,所以微信推出了小遊戲分包載入這一個功能。

所謂的分包載入,即把遊戲內容按照一定的規則拆分成幾個包,在首次啟動時先下載必要的包,這個必要的包我們稱為【主包】,開發者可以在主包內觸發其他分包的下載,從而把首次下載的耗時分散到遊戲執行中。

分包載入包大小限制

目前小遊戲分包大小有如下限制:

  • 整個小遊戲所有包大小不超過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無法載入分包下的字型檔案,預計會在下個客戶端版本中修復。

本節內容就為大家介紹到這裡,下節將為大家介紹小遊戲音訊播放的相關內容。

學習是一條令人時而喜極而泣,時而鬱鬱寡歡的道路。如果您覺得這篇文章對您有所幫助,請您酌情讚賞!

微信小遊戲開發(9)- 分包載入

相關文章