# 游戏资源压缩指南

# 海外用户网络环境

当前国内用户拥有豪华的网络配置(5G+WIFI覆盖率 > 85%,数据见 技术手册|微信开放文档),小游戏国内开发者几乎可以不用担心由网络引起的问题。

然而由于网络基础设施的差异,海外用户通常不具备国内这样的条件,例如东南亚国家用户数据上表现为WIFI覆盖率较低、移动网络以4G为主、端到端耗时较高(部分国家达到国内的10倍及以上)。

大多数东南亚用户的机型在国内属于低档机范畴。

# 为什么要压缩游戏资源?

游戏资源的大小口径是用户打开小游戏时下载消耗的流量大小,因此囊括了游戏本体资源及从小游戏平台和游戏CDN下载等各方面因素的作用。在海外用户常在的弱网环境中,可以预见到会有以下方面的影响:

  1. 拖慢游戏启动、加载速度,尤其是游戏启动速度能够很大程度影响用户留存,资料见 性能优化|微信开放文档
  2. 过多的流量消耗会降低用户的游玩意愿,国内通常不会考虑这方面的因素,但在海外网络基础设施和流量资费的作用下,这里预计会有较大的影响。

# 如何压缩游戏资源?

目前出海小游戏以Unity和Cocos引擎开发为主,我们收集了一些能够在Unity和Cocos项目中通过简单调整可以有效减少游戏资源大小的方法,开发者可以参考我们的推荐设置和测试数据来优化,以下是各节对游戏资源的主要优化:

压缩方式 目的
纹理压缩、图片压缩 减小游戏的图片纹理存储体积
CDN压缩 降低网络传输时的流量消耗
Cocos引擎插件 去除重复下载cocos引擎的网络开销

# 纹理压缩

纹理压缩主要用于优化游戏显存和内存占用和带宽(资料见 资源纹理压缩|微信开放文档),Unity和Cocos中都已提供了统一的纹理压缩工具。合适的纹理压缩配置能够大幅降低图片纹理的存储。

# 压缩纹理格式的选择——请只选择ASTC压缩纹理格式

近期小游戏出海客户端只上架安卓平台,我们在Unity和Cocos3引擎中分别使用了一个项目来测试不同压缩纹理格式在小游戏出海客户端中的表现,具体如下表:

.

团队引擎-手册:快速上手
Unity支持的三种格式ASTC、ETC2、DXTC中,只有ASTC在小游戏出海客户端渲染正常;Cocos中ASTC和ETC2能够正常渲染。 除渲染表现符合小游戏平台预期外,ASTC还能够通过设置Block大小来压缩质量(见下一节),综合来看,建议选择ASTC纹理

# 如何选择ASTC Block大小

选择ASTC Block的目的主要是为了压缩纹理大小,ASTC每个Block固定占128位,但是允许设置每个Block块描述的像素大小(如4x4表示一个Block描述16个像素),简单理解下ASTC纹理大小的计算公式: .
这个公式主要表达了一个信息:ASTC纹理的大小只与图片本身的分辨率和Block大小有关,和图片的质量、存储大小、格式等无关。
因此使用ASTC时不要对原图事先做额外的质量压缩或格式转换,可能会损害图片质量。
从公式可以大致计算ASTC对图片的压缩效果,我们使用AI生成了60张总共109MB的高质量PNG图片并在Cocos3中进行测试,来更直观的表现ASTC不同Block大小带来的压缩效果(数据仅供参考),以及为何我们不建议选择ETC2。
图片大小:
图片大小
压缩率:
压缩率 由于ASTC是有损压缩,因此实际使用时需要结合游戏实际表现来定Block的选择,当前面临的海外用户手机基本都属于低档机。 我们提供一个推荐配置,开发者可以根据实际游戏情况调整:


普通贴图 大尺寸/低优先级贴图 法线贴图 HDR贴图 带透明通道贴图
8x8 8x8、10x10、12x12 4x4、5x5 4x4、5x5 4x4、5x5、6x6

# 在Unity引擎中设置纹理压缩

如引擎版本高于2021,可使用引擎自身的ASTC压缩格式。
在Unity引擎中可以在Edit -> Project Settings -> Player中设置默认的压缩纹理格式。 默认压缩纹理格式
也可以在资源管理器中设置单个或多个图片的纹理参数
设置纹理参数
较低版本的Unity可能不支持ASTC纹理,可以使用微信小游戏提供的纹理压缩工具,见微信小游戏压缩纹理工具2.0(Beta)

# 在Cocos引擎中设置纹理压缩

注:Cocos至少到Cocos3才能支持ASTC纹理压缩,如果使用的引擎版本比较低找不到ASTC纹理,则跳至下一节——图片压缩
在资源管理器中点击图片素材(可以多选来批量设置),通过右侧属性检查器勾选压缩纹理并选择正确的压缩纹理预设。
压缩纹理预设可以通过属性检查器的编辑预设来编辑或者通过项目->项目设置->压缩纹理编辑。 示意图如下:
.
其他信息可以查看cocos官方文档压缩纹理|Cocos Creator

# 图片压缩

Unity开发的小游戏请直接使用ASTC纹理压缩;Cocos游戏如果能够使用ASTC,我们推荐使用ASTC纹理压缩,但如果游戏选择不使用或者部分场景、游戏引擎不支持ASTC纹理时,可以选择对图片进行压缩。选择合适的压缩质量能够同时兼顾图片质量和大小,不过具体选择仍要结合游戏表现。

# PNG压缩

注:如果PNG图片不存在透明通道且不是渐变素材,建议直接转换成JPG,见下一小节——JPG压缩
cocos中自带的PNG压缩和压缩纹理的设置方法一样。
cocos3设置方法可以参考在Cocos引擎中设置纹理压缩一节,压缩方式选择PNG即可,如下图:
cocos3设置方法 cocos2同样可以在资源管理器中选择图片的面板中设置PNG压缩。
cocos2设置方法 cocos2也可以使用商城的免费插件来做批量压缩 Cocos扩展-自动压缩PNG资源:【Cocos Creator 编辑器扩展】项目构建完成后自动压缩PNG资源
压缩质量默认是80,基本上不需要修改,再往下压缩并不会减少太多了质量,但对图片效果影响很大。
附部分质量压缩测试数据
图片大小:
PNG图片大小测试数据
压缩率:
PNG压缩率测试数据

# JPG压缩

如果PNG图片不存在透明通道且不是渐变素材,建议使用JPG压缩,可减少大量体积
与PNG压缩一样,cocos官方的JPG压缩同样是在纹理压缩中设置。
cocos3设置方法参考在Cocos引擎中设置纹理压缩一节,选择JPG压缩即可:
cocos3设置方法 cocos2设置方法在资源管理器中选择图片的面板: cocos2设置方法 压缩质量默认是80,基本上不需要修改,JPG的过度压缩会对显示质量造成很大的损害。
附部分质量压缩测试数据(由PNG转换成JPG后再做测试)
图片大小:
JPG图片大小测试数据 压缩率(相比较PNG原图):
JPG压缩率测试数据

# Cocos引擎插件

绝大多数小游戏使用游戏引擎开发,使用的游戏引擎版本相似或相同,且在代码包中占比较大。引擎插件能力即是游戏引擎(作为插件)单独在微信客户端进行缓存。当小游戏首次启动时,如果本地已经存在同类别游戏引擎插件,可直接复用或可通过增量下载的方式快速下载,从而提升启动速度和降低下载流量。
Cocos2和Cocos3(详见微信小游戏引擎插件使用说明)均已支持小游戏引擎插件。 Cocos3引擎插件能够节省约500KB流量开销,Cocos2引擎插件能够节省约300KB流量开销,对于体量较小的小游戏有显著效果。
在构建发布面板中即可开启该选项。 引擎插件
建议开发者开启该功能来复用小游戏本地已有的引擎。

# CDN压缩

小游戏中可能包含大量的远程CDN资源,CDN服务商通常都提供了CDN压缩功能(如内容分发网络CDN智能压缩配置_腾讯云 )可以降低下载资源时的流量消耗,建议开发者CDN开启Brotli或者Gzip,优先使用Brotli
Gzip和Brotli对文本资源(包括html、js、css等代码文件)的压缩效果非常显著,通常压缩率能够达到10%~30%,其中Brotli的压缩率会优于Gzip。
尽管游戏引擎构建时可能已经对部分资源进行了高度压缩,但开启CDN压缩仍然会进一步减少流量消耗,例如Unity示例项目Endless Runner在开启CDN Gzip压缩后相比压缩前减少了13%的流量消耗(59MB -> 51MB)。
对于使用了ASTC纹理压缩的小游戏,尽管ASTC本身算法压缩已经比较理想,开启CDN压缩同样能减少这些纹理在传输时约5%~15%的流量消耗,我们对比测试了CDN Gzip压缩应用在ASTC纹理下的效果。
不同Block下的流量消耗对比:
.
不同Block下的压缩率:
.

# 总结

  1. Unity和支持ASTC纹理的Cocos3项目建议选择ASTC纹理压缩,并根据游戏贴图类型来选择合适的Block大小。
  2. 对于不适合使用纹理压缩的图片,不带透明通道和渐变的PNG建议转换JPG格式,PNG和JPG均建议设置80质量压缩。
  3. Cocos游戏项目建议启用引擎插件,复用小游戏本地缓存的引擎。
  4. 建议开发者CDN开启Brotli或者Gzip,优先使用Brotli。

附测纹理压缩和图片压缩测试各规格的数据汇总
图片大小:
图片大小数据汇总
压缩率:
压缩率数据汇总