提交 2e720841 编写于 作者: S skyler

update WasmSplit.md

上级 4a1d946f
# 代码分包
目前我们采用了一种 Profile Guided Optimization 的方式,通过离线运行时收集信息,将小游戏的 wasm 代码包进行拆分,使得小游戏可以先加载较小的首包进入主场景,再异步加载剩下的分包
## 介绍
我们提供了一个开发者工具插件来辅助分包过程,依赖的[开发者工具](https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html)版本为 1.05.2104251 RC 及以上,稳定版 1.05.2105100 已支持
unity导出小游戏项目后,代码是在一个wasm文件里,经过brotli压缩后,放在wasmcode目录下
一般小游戏的wasm大小都为30M左右,压缩后为6M左右
启动阶段,小游戏需要先下载完wasmcode再编译,这里会占用较高的内存和时间
因此我们提供了代码分包工具,将原来的wasm拆分为两个,一个用于启动加载,另一个可以延迟加载
使得小游戏可以先加载较小的首包进入主场景,再异步加载剩下的分包
## 原理
目前我们采用了一种 Profile Guided Optimization 的方式,通过运行时收集信息,按函数粒度对小游戏的 wasm 代码包进行拆分
开发者可以在离线测试阶段,通过真机运行小游戏,并尽量覆盖游戏内的场景,特别是**启动后最先进入的场景和关卡(比如新手教学,游戏最初的关卡内容)**来收集信息
工具上会显示收集到的函数个数,这时候就可以重新分包,将收集到的函数加入首包
因此收集工作非常重要,收集的场景覆盖率越高,命中子包的时机就可以相应延后,使得首包可以满足大部分新玩家前几分钟的游戏进程
## 插件
我们提供了一个**微信开发者工具**里的**插件**来辅助分包过程,依赖的[开发者工具](https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html)版本为 1.05.2104251 RC 及以上,稳定版 1.05.2105100 已支持
分包工作流如图所示
<image src="../image/wasmsplit/workflow.png">
## 打开分包
如图所示,对于未分包项目,开发者可以在插件里启用分包,然后配置版本信息,这时候会插件会自动开始第一次分包,变成已分包项目(profile版本)
通过开发者工具的设置-拓展设置-编辑器自定义拓展,打开 minigame.codeSplit 这个插件的开关
<image src="../image/wasmsplit/extension-panel.png">
<image src="../image/wasmsplit/enable-plugin.png">
对于已经分包的项目,开发者每次覆盖运行了一些场景,收集到有新增函数个数的时候,就可以生成下一个分包
分包分两种,profile版以及release版,其中的差别是release版不会在wasm里打入收集信息
需要特别注意,**发布的时候要注意使用release版**
## 使用流程
### 打开分包
通过开发者工具的设置-拓展设置-编辑器自定义拓展,安装 wasmCodeSplit 这个插件(插件后续0.0.6及以下存在部分使用问题,但不影响分包结果,我们会在0.0.7修复相关问题)
<image src="../image/wasmsplit/extension-panel.png">
### 迭代流程
1. 打开插件开关后,在目录树上的工具栏中,可以看到插件的按钮,如图所示,点击后即可进入插件页:
<image src="../image/wasmsplit/code-split-index.png">
<image src="../image/wasmsplit/enable-plugin-1.png">
2. 点击启用代码分包,新导出的小游戏(注:同一游戏从 unity 的不同次导出也认为是新的)会提示输入版本描述,简单输入方便识别版本的描述即可,然后插件会自动进行首次分包
<image src="../image/wasmsplit/enable-plugin-2.png">
<image src="../image/wasmsplit/start-split.png">
3. 第一次分包完成后,就可以开始迭代式收集,每一轮迭代流程如下:
- 点击开始收集
- 点击开发者工具的预览,在真机上跑,有条件的话可以尽量覆盖各种机型(主流品牌)以及平台(Android/iOS)
- 当插件页显示的收集到增量函数个数相对稳定时,可以点击结束收集
- 点击生成 profile 包
- 当插件页显示的收集到增量函数个数相对稳定时,可以点击生成profile包
- 真机预览进行下一次收集
<image src="../image/wasmsplit/code-split-index-2.png">
<image src="../image/wasmsplit/profiling.png">
<image src="../image/wasmsplit/code-split-index.png">
随着迭代轮数增多,新增函数会越来越少,
随着迭代轮数增多,新增函数会越来越少,这里没有完成收集的标准,建议开发者能回归覆盖游戏的各种启动场景即可(不同进度,二次启动等等),目的是为了延迟依赖剩下的分包的时间
这里没有完成收集的标准,建议开发者能回归覆盖游戏的各种启动场景即可(不同进度,二次启动等等),目的是为了延迟依赖剩下的分包的时间
**注意:分包过程中尽量不要对小游戏项目进行编辑,开发者工具上的console报错也可以忽略,等分包完成后回到上图界面再操作**
4. 当收集评估 ok 时,可以点击生成 release 版分包,生成最终的发布版本(如果生成了 release 包,下次收集前需要先生成 profile 包)
## 关闭分包
### 关闭分包
如果想发布不分包的版本,点击插件页的关闭代码分包按钮即可
如果想回退到未分包的版本,点击插件页的关闭代码分包按钮即可
image/wasmsplit/code-split-index.png

20.9 KB | W: | H:

image/wasmsplit/code-split-index.png

160.4 KB | W: | H:

image/wasmsplit/code-split-index.png
image/wasmsplit/code-split-index.png
image/wasmsplit/code-split-index.png
image/wasmsplit/code-split-index.png
  • 2-up
  • Swipe
  • Onion skin
image/wasmsplit/extension-panel.png

67.5 KB | W: | H:

image/wasmsplit/extension-panel.png

452.9 KB | W: | H:

image/wasmsplit/extension-panel.png
image/wasmsplit/extension-panel.png
image/wasmsplit/extension-panel.png
image/wasmsplit/extension-panel.png
  • 2-up
  • Swipe
  • Onion skin
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册