微信小游戏进入 WebGPU 时代,LayaAir 怎么做技术升级?
文章目录
2026 年 5 月 27 日,曾老师在杭州参加了 2026 微信小游戏开发者大会。这是曾老师以媒体和开发者双重身份参会的第 3 年。
本篇是大会下午场开发者分享实录,标题为:LayaAir 引擎:小游戏技术演进新实践
分享人为 Laya 引擎王亚伟。
更多分享:
- 上午场的完整分享: 50 万开发者,5 亿月活,千万流水:微信小游戏 9 年答卷
- 开发者分享: 《一箭又一箭》的组合创新心路历程:简单克制,一切有解
- 开发者分享: 上线 2 年仍日耗 40 万,《打个螺丝》从调优到长线运营的全流程分析
- 开发者分享: 500 个换卡群、528 万 MAU:《向往的生活》小游戏的长线打法
- 开发者分享: 从 20 年老 IP 到微信小游戏:《冒险岛》的加减法
首先介绍 LayaAir 引擎。它是全平台 3D 渲染引擎,目前拥有 120 万开发者。在微信小游戏平台上,有很多产品使用 LayaAir 开发,比如《曙光重临》《主宰世界》等。
简单介绍几个特点。第一,全平台,主打一次开发,可以同时发布到小游戏、iOS、Android、鸿蒙等操作系统。第二,极致的性能优化,超快的加载速度和极致的运行效率,是引擎的一大特点。第三,轻量化,可以按需打包,让包体尽量达到最小。
第四,扩展性强。LayaAir 是开源引擎,开发者可以修改代码,也可以自定义渲染管线。3.0 之后还有组件商城,大家可以上传和下载功能,并基于组件商城扩展 IDE,在 IDE 基础上构建自己的框架,快速产出游戏内容。功能也比较全,2D、3D、物理都应有尽有,还有简单易用的 IDE 开发环境。
LayaAir 3.4 的新功能
前一段时间我们发布了 LayaAir 3.4。3.4 版本有两项非常重大的功能。第一是运行时编辑,左边的视频可以在游戏实时运行状态下进行修改,美术和开发人员可以在实际运行效果中发现问题,并进行实时编辑。
第二是 2D、3D 混合。随着游戏行业发展,大家对 2D 游戏和 3D 游戏的边界越来越模糊。2D 游戏可以使用 3D 模型;3D 游戏为了提高效率,骨骼动画也可能用 Spine 动画来做。以前版本的 LayaAir 引擎使用 RenderTexture 的方式进行 2D、3D 混合,3.4 版本打造了新的容器方案,可以不用借助 RenderTexture,就轻松进行 2D、3D 混合。这样既减少了内存占用,也提升了渲染效率。
WebGPU 支持
下一步主要介绍 WebGPU。刚才介绍了微信小游戏开始支持 WebGPU,这对小游戏行业是非常利好的消息。LayaAir 引擎从 2023 年开始支持 WebGPU。它能做到什么?渲染效果有非常大的提升。像视频里的水面扰动效果,就是用 WebGPU 的 Compute Shader 做的,是 WebGL 很难达到的效果。
除了效果提升,效率提升也很明显。我们看同一个游戏案例的对比,在小米 15 等机型上做性能对比,会发现 WebGPU 版性能大约是 WebGL 版的 1.5 倍。这里着重说一下:游戏内容越复杂、渲染对象越多,提升效果越明显。
微信小游戏开始支持 WebGPU,LayaAir 引擎也无缝对接了微信小游戏 WebGPU 版本。我们希望让开发者做到无感知:不用管调用的是 WebGPU 还是 WebGL 渲染架构,只需要在发布微信小游戏时勾选 WebGPU,就可以在两种模式间自动切换,真正做到同一套工程、双渲染架构。我相信在微信小游戏的大力推动下,WebGPU 技术势必会引起小游戏行业的新一轮技术革新。
启动速度优化
LayaAir 3.5 这个版本针对小游戏做了很多优化,包括启动速度、渲染升级以及多线程架构。下面一一介绍。
第一,启动速度。针对小游戏平台,大家非常在乎小游戏的启动速度,因为它会直接影响转化率。很多开发者在优化小游戏启动速度时会发现:JS 下载完成了,资源也下载完成了,但进入场景时总会有卡顿。如果是有经验的开发者,会发现这时候大概率是在进行 Shader 编译。
我们首先会在 3.5 支持把 Shader 编译与链接从 JS 主线程阻塞路径中解耦,并行调度,降低启动阶段同步等待造成的卡顿。
第二,支持减少 Shader 宏编译。大家都知道,一个 Shader 中可以写很多宏定义。每碰到一个新的宏组合,都可能需要重新编译。3.5 通过 override constants 替代宏变体编译,让一份 GPUShaderModule 完成 WGSL 解析后,可以被多个 pipeline 以不同常量参数复用。这相当于用新的技术方案,让 Shader 不再反复编译。
另外,3.5 会拆分 10 余项 JS 能力,供项目按需加载,减少首包中非必要引擎代码的占用。
我们引擎本身也支持三套物理库,包括 PhysX、Bullet、cannon。开发者可以根据项目规模、模拟精度和包体预算,加载不同的包体。
渲染管线升级
第二说一下渲染升级。首先,通过 TextureArray 能力解决 2D UI 合批问题。这个发现有时候挺颠覆认知。我们帮开发者排查 3D 项目效率时,大部分精力都放在 3D 场景、骨骼动画、粒子这些部分上。
但后来发现,一些简单 UI 的渲染消耗可以占到整个游戏的 30%,甚至 35%。这有点颠覆我们过去的判断:原来 UI 也会消耗这么多性能。因为 UI 本身用到的资源并不多,所以我们用 TextureArray 的方式进行 2D UI 合批,减少复杂界面的 DrawCall。
3D 层面,我们也内嵌了 WebGPU Driven 流程。比如以前大量渲染同一棵树、同一片草,只是旋转、平移、缩放不一样,在 WebGL 1.0 时代只能一棵一棵绘制,或者提前做离线合批。到 WebGL 2.0 时代,我们采用 GPU Instancing 的绘制方式;到 WebGPU 时代,则可以采用 Compute / Indirect Draw 的方式,更好地提高运行效率,让你可以绘制更多东西。
还有开放 VFX 粒子能力。我们知道小游戏和 Web 端的运行语言是 JS,相对于 C/C++ 这类编译型语言,JS 的运行效率还是有一些欠缺。开发小游戏时,粒子系统很多时候只能采用 GPU 粒子:好处是性能高,缺点是只能有发射器,也就是按照一定参数发射后就不能再改变。
比如做一种效果:人在上面焊东西,电焊弧的粒子弹到地面后又反射回来。这种效果 GPU 粒子没有办法做到,只能用 CPU 粒子。但 CPU 粒子又受限于 JS 性能,很难达到效果。新开放的 VFX 能力利用 WebGPU 的 Compute Shader,把粒子分为发射器、中间控制和渲染三个阶段,不仅能让渲染效果达到最优,也不影响渲染效率。
大家知道微信小游戏推出了 Worker 线程能力,这使我们可以做双线程渲染架构。Worker 线程中可以处理场景树、Transform、动画、剔除、排序等工作,把持有 GL Context、资源上传和执行 Draw Call 的渲染能力放到主线程。这样就能充分发挥现在移动设备的多线程能力。
最后,在 AI 时代,引擎如何和 AI 深度结合,提供更好的开发工具,给开发者提效,是我们一直在探索的方向。这个方向我们大概探索了三年。
LayaIdea
公司推出了一个产品叫 LayaIdea,它是基于 AI 的创作工具,专注于互动试玩广告。它能做到什么?只需要通过自然语言输入需求、上传美术素材,AI 就会对素材进行匹配处理,自动搭建 3D 场景、搭建 UI、编写代码,并最终生成试玩预览效果。如果发现 bug 或报错,它还会自动修改,最后可以一键发布到微信试玩包里。
我们在 LayaIDE 的基础上只增加了一个聊天框,也就是不用改变任何用户习惯,符合 AI 潮流下的交互方式:只需要通过自然语言聊天。但这个简单聊天框可以说是「简约而不简单」。虽然只有一个聊天框,里面包含了大量功能,比如 Agent 编排,以及 Coding MCP、IDE MCP。也就是说,需要用大模型调度并编写 Laya 引擎代码时,我们自己做了大量 Coding MCP,也调用了 IDE 能力。
我们还支持 HTML、CSS 和 SVG 这种方式。大家都知道,在 AI 时代,如何更好地拥抱 AI?一个关键点是 AI 写 HTML、CSS 的能力,因为相关语料是以亿为单位计算的。所以在 Laya 引擎中,编写 UI 的方式完全支持 HTML 和 CSS 的样式,引擎做了无缝衔接。最终通过 Agent 编排和工具调用,产生一个新的形态。
我们来看整个 LayaIdea 的截图。右边只加了一个聊天窗口,左边是我们发布到微信试玩广告上的效果。它真正做到了从简单文档输入,到场景搭建、Coding 编写、试玩调试,再到一键发布,形成一个端到端的 AI 产品。
对这款产品感兴趣的同学,可以访问公司官网。大家只需要管你的创意,其他东西全部交给我们来处理。
- 文章ID:2874
- 原文作者:zrong(Jacky)
- 原文链接:https://blog.zengrong.net/post/layaair-minigame-tech-evolution/
- 版权声明:本作品采用 署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0) 进行许可,非商业转载请注明出处(原文作者,原文链接),商业转载请联系作者获得授权。