Cocos Creator 3.8.5 正式发布，更小更快更多平台！

最新推荐文章于 2025-04-02 16:28:47 发布
最新推荐文章于 2025-04-02 16:28:47 发布
阅读量1.2k 收藏 8
点赞数 23
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/weixin_44053279/article/details/144780138
版权

在 Cocos Creator 3.8.5 版本中，我们做了新一轮的优化。

在加载速度、代码裁剪、平台增强等多方面做了优化，提升了开发者体验和游戏性能。

希望能够助 Cocos 开发者们的产品更上一层楼。

一、加载速度优化

1、WASM 模块延迟加载

在早期版本中，Cocos Creator 在打包时就支持了 WASM 模块分离，使 WASM 模块可以放入分包之中，不占用主包包体。

a6159856c261149ea9a270b9d6c93c4b.png

在 3.8.5 版本中，我们支持 WASM 模块延迟加载，这对使用了 Box2D、Spine、Bullet 等 WASM 库的游戏非常有帮助。用户只需要在使用相关功能之前，调用下面的API函数，加载对应的 WASM 库即可。

  • loadWasmModuleBox2D

  • loadWasmModuleSpine

  • loadWasmModuleBullet

  • loadWasmModulePhysics

这样一来，开发者就可以控制 WASM 的加载时机，使 WASM 模块的加载不占用首屏时间，大大缩短玩家首次进入游戏的加载时长。

2、代码裁剪

在 Cocos Creator 3.8.5 中，引擎内部采取了多种方案组合，降低 2D 项目包体大小。

  1. 移除 web 平台 gfx 层无用的代码

  2. 构建引擎代码支持"内联枚举"功能

  3. Spine 模块包体优化，体积相比 v3.8.4 缩减 40% 左右

  4. 显示声明 ts 类的构造函数，避免生成无用代码

我们还会继续努力，确保纯 2D 项目的包体与 2.x 项目持平，同时尽可能减少 3D 项目。

二、CRP 管线优化

81c320410cd409636c28bf2fe3e86760.jpeg

v3.8.4  提供的可定制管线 CRP-Customizable Render Pipeline 受到了许多开发者的欢迎，同时我们也收到了非常多的反馈。在 v3.8.5 版本中，我们优化了若干反馈，并对管线进一步加强。

在 v3.8.5 中，我们完善了景深（DOF）等后期效果，自定义后效支持组件式添加，也进一步优化了性能和内存占用。

CRP 会在易用性、效果、性能和内存占用等方面持续优化，最终成为项目开发的主流选择。

三、平台增强

1、鸿蒙 NEXT

7fb18a919b1997f63c2b99c2a3807943.png

Cocos Creator 3.8.5 提供了华为完全自主研发的鸿蒙 NEXT 操作系统的发布支持，开发者通过发布面板即可一键发布到鸿蒙 NEXT 平台。

2、Google Play

36d757e8b5692b0ece63be88316d8412.png

Cocos Creator 3.8.5 提供了一键发布到 Google Play 的能力。与普通的 Android 发布相比有一些差异和便捷特性。

  1. 一键激活 ADPF（Android Dynamic Performance Framework），这是一个动态性能优化框架，可以更好地提升游戏的散热表现和CPU性能。

  2. 默认渲染后端为 VULKAN

  3. 可以配置应用程序图标

3、咪咕小游戏

c1df1500b6cf8437d65ad3c48c3fa506.png

Cocos Creator 3.8.5 支持一键发布到咪咕小游戏，并在发布时配置相关参数。

18f5b36f2f1dfef806aa4796286d150f.png

2024年，结合自身资源和行业趋势，咪咕游戏开始打造 “双特色” 游戏分发平台。启动了全新的小游戏合作政策：60% 分成，零投入、免费流量推广扶持等。开发者们可以多多关注。

四、编辑器提升

646c0488838762556bbe0729e766d7c9.jpeg

1、启动速度优化

Cocos Creator 3.8.5 中，我们优化了启动时的资源编译方案，项目启动速度提升约 30% 左右，后面我们还会继续优化启动速度，节省开发者项目启动时间。

2、升级 Electron

d21afd7d39729c22643fa6c55d1245b2.png

Electron 升级到 v31.3.1，使编辑器可以享受到新版 NodeJS 的增益，不仅能够提升性能，插件开发者们还可以使用新版 NodeJS v20.15 的 API 和特性。

3、场景编辑器点选规则优化

3.8.5 中，我们优化了场景编辑器中物体点选规则，当同一个区域物体较多时，会优先选中较近的物体。

4、属性检查器支持 Prefab 预览

34b55f328ed2cfcc0264cacf601720e8.jpeg

5、属性检查器支持 Spine 预览

b9497d5ca31874c35f4d2780d5a8d0b4.png

五、一些重要问题修复

  1. Node 的 position/rotation/scale 等设置方法改回和 v3.8.3 一样的方式。

  2. 修复构建时自动图集压缩纹理后还保留原图的问题。

  3. 修复 Box2D 在 Contract 回调函数内销毁节点会崩溃的问题。

  4. 修复热更新文件很多时，会造成UI页面卡主的问题。

  5. Prefab 中会记录无用的 Mesh 数据。

  6. iOS ETC 压缩格式，使用 Mac 压缩后透明度不对。

  7. 自动合图的纹理填充率变低，导致 UI Drawcall 增加。

六、v3.8.6 预告

03bfbbe35cd4c33c5d1a044f572e2961.png

Cocos Creator v3.8.6 版本的迭代将继续聚焦于优化包体大小和加载速度，增强对 Spine 和 Box2D 的支持，提升编辑器易用性等。

70fae479dd7c248e930064f1faa638f3.png

感谢大家对 Cocos Creator 的支持与信任，让我们一起创造更多优秀的作品！

Cocos 引擎
关注
cocos3.8技能冷却效果
shuishen49的专栏
07-21 248
动态生成一个mask的节点。我把他写在start里面调用了。因为我想要顺时针旋转，然后从12点开始，就只能设置Scale为-1和-1 了。大概是这样的20x20 我整合到资源包里面去了。需要的话自己找一下。抖音小游戏贪吃的方块上架了 ，欢迎大家来玩啊。我是用代码动态生成的，需要的话可以自己改一下。效果如下，需要准备一张白色的图片。不过这个图片系统自带一张。点击之后执行的代码。
cocos creator 游戏
10-11
cocos creator 开发的用于学习。
包体、性能、Spine、Skew、Box2D、鸿蒙Next|Cocos Creator 3.8.6 正式版来了！
Cocos的博客
04-02 1304
1.如果旧项目需要升级到 Spine 4.2，请先使用 Spine 编辑器将原有 Spine 资源重新导出为 4.2 的资源格式，覆盖到项目 assets 的对应目录下。除此之外， 3.8.6 中还支持了多个 Spine 共享一个纹理集，以及修复了 Spine 中自定义材质的动态 Uniform设置不起作用的问题。引擎功能裁剪支持多套配置，可在发布面板关联对应的配置方案，实现不同平台使用不同的裁剪方案。透露这么多 v3.8.7 的功能，已经是小编的极限了，再多的话，怕是要挨打了。
CocosCreator
qianpaishafa的博客
07-18 761
1.获得节点上的组件使用getComponent    start: function () {         var label = this.getComponent(cc.Label);         var text = this.name + ' started';         // Change the text in Label Component
Cocos Creator 介绍
梦幻DUO的游戏开发之路
07-13 3048
CocosCreator的目的是提供两种可以互相合作的工作流：面向设计和面向开发。主要有如下特性： 通过编辑器调整脚本声明的数据属性 UI系统支持画布适应，配备代码元素可以完美适应各种设备的分辨率。 2D动画系统支持轨迹预览和曲线编辑。 通过动态语言支持的脚本开发使得远程调试设备更简单。 一键发布不同平台的产品。 组件化脚本和开放插件系统为开发者提供自定义工作流。 附录： Cocos Creator
浅析Cocos creator
凉风之魅的专栏
05-24 3908
1：它是一个完整的游戏开发解决方案，包括了 cocos2d-x 引擎的 JavaScript 实现，以及能让你更快速开发游戏所需要的各种图形界面工具 2：Cocos Creator 是以内容创作为核心的游戏开发工具，在 Cocos2d-x 基础上实现了彻底脚本化、组件化和数据驱动等特点。 3：设计和程序两类人员的完美分工合作 程序员开发可以挂载到场景任意物体上的功能组件，开发游戏所需要的数据结构和...
CocosCreator 创建贝塞尔雷达图
SlowFeather's blog
03-09 526
CocosCreator 创建贝塞尔雷达图前言制作效果代码 前言 需求要求实时显示脑波变化数据，并且以一种高科技效果展示，甲方觉得普通折线雷达图不够好看，于是改为贝塞尔雷达图。 制作效果 代码 直接与Graphics组件挂载在一个空物体上即可。 代码最下面的注释是用来显示贝塞尔曲线手柄的。 const {ccclass, property} = cc._decorator; @ccclass export default class RadarChart extends cc.Component {
cocos creator 3.8 飞机大战小游戏
11-24
在使用Cocos Creator开发游戏时，通常会遵循一定的项目结构和文件命名规范，以便更好地组织代码和资源。 本案例中的“飞机大战小游戏”是一个使用Cocos Creator 3.8制作的简单示例项目，虽然未经过优化，并且缺少...
cocos creator 3.8.4
11-26
Cocos Creator 3.8.4不仅是一个游戏开发工具，它更是一个完整的生态系统，包含大量的文档、教程、社区支持和插件资源，开发者可以利用这些资源进行学习和扩展。Cocos Creator还鼓励开源精神，很多组件和插件都可以在...
cocos creator 3.8.5 以上 super html插件
04-23
随着版本迭代，Cocos Creator 不断更新和优化，其中3.8.5版本就是一个重要的更新节点。在这个版本中，开发者们引入了一个名为 "super html插件" 的新功能，这是一个关键的更新，因为它极大地扩展了Cocos Creator 在...
cocos creator 6个小游戏合集
06-27
本合集包含了六个由Cocos Creator实现的小游戏，包括2048、傻鸟和消消乐等经典玩法，旨在提供一个学习和分享的平台，帮助开发者们提升技能，了解游戏开发流程。 首先，我们来看2048这个游戏。2048是一款基于数字...
cocos creator 摇杆
03-30
一个简单的摇杆控制主角移动dome,解压后通过cocos creator打开，可发布在移动平台上测试，希望大家有一点帮助
cocos creator 跳一跳
08-28
跳一跳游戏，不是微信上大家知道的跳一跳，该游戏为：主角竖直向上跳，如果跳到了有浮岛的地方则不会掉下去，负责掉下去，游戏结束。
cocos creator 官方文档离线
03-07
cocos creator 1.6最新版用户手册 欢迎使用 Cocos Creator 用户手册！本手册包括详尽的使用说明、面向不同职能用户的工作流程和 step by step 的新手教程。能够帮您快速掌握使用 Cocos Creator 开发跨平台游戏的方法。
cocosCreator小游戏
05-17
用js写的cocosCreator 小游戏，有完整的游戏开发代码。
cocos creator 3.8 用贴图创建材质
11-20
在使用Cocos Creator 3.8创建游戏或应用程序时，材质是定义对象外观和质感的重要组成部分。材质可以通过各种参数来控制对象的表面特性，如颜色、纹理、反光度等。在Cocos Creator中，材质通常与着色器和贴图共同工作...
Cocos creator---随手记（一）
Fayeni的博客
09-04 516
刚学没多久，试着做了个逻辑比较简单的判断，只是为了记录自己的成长，也是舍不得这段代码，后续做了优化后就删掉了，所以保留一下以作纪念吧！ 内容大概就是一个按钮，有两种状态，红色和绿色，点击就切换 在按钮为绿色时就可以转动，为红色时，wheel轮子就停止转动 在wheel轮子转动时，wrench扳手不会触发任何事件，停止转动时可以触发wheel事件 点击拾取工具代码： //只能点一次 if (this.shedClickTem...
CocosCreator入门
TxNet
04-18 8416
1.关于Cocos Creator Cocos Creator 是什么？ 它是一个完整的游戏开发解决方案，包括了 cocos2d-x 引擎的 JavaScript 实现，以及能让你更快速开发游戏所需要的各种图形界面工具，在 Cocos2d-x 基础上实现了彻底脚本化、组件化和数据驱动等特点。 2.项目文件夹结构 初次创建并打开一个 Cocos Creator 项目后，您的项目文件夹将会包括以下结...
cocos-creator地位
听风看海的博客
12-19 738
cocos-creator前言总结 前言 在详细的了解cocos-creator之前先说说当前的情况吧，目前国内的2d游戏引擎有三个巨头分别是cocos-creator、laya、白鹭（egret）虽然说这些引擎也支持3d游戏开发，但是也才是这几年才开始支持，不够健壮。那么3d游戏的代表那只有Unity3D了。 # 一、引擎选择 cocos-creator，开始也是使用白鹭引擎但是后面转了cocos，有几点，快，快，快。 开发效率高，开发速度，调试速度快 运行性能快 剩下的自己试试就知道了 总结 喜
是什么错误
最新发布
05-16
### 关于 Cocos Creator 3.8.5 中无法添加重复组件 `cc.UIOpacity` 的解决方法 在 Cocos Creator 开发过程中，可能会遇到尝试向同一个节点多次添加相同类型的组件时引发的错误提示：“Can&#39;t add component &#39;cc.UIOpacity&#39; because KK already contains the same component”。这种问题的根本原因在于 Cocos Creator 不允许在同一节点上存在多个相同的组件实例。 以下是针对该问题的具体分析和解决方案： #### 问题根源 当调用 `node.addComponent(UIOpacity)` 方法时，Cocos Creator 会在目标节点上检查是否存在同类型的组件。如果已存在，则会抛出异常并阻止进一步操作。这是因为同一类型组件的功能通常可以覆盖整个节点范围，因此无需重复添加[^1]。 --- #### 解决方案一：调整代码逻辑顺序 类似于引用中的案例，可以通过重新安排代码执行顺序来规避冲突。例如，确保不会在已有 `UIOpacity` 组件的情况下再次尝试添加它。以下是一个修正后的代码示例： ```javascript const node = new Node(&#39;box&#39;); this.node.addChild(node); // 检查是否已经有 UIOpacity 组件 if (!node.getComponent(cc.UIOpacity)) { const uiOpacity = node.addComponent(cc.UIOpacity); uiOpacity.opacity = 128; // 设置透明度值 } // 添加其他必要组件 const sprite = node.addComponent(cc.Sprite); sprite.sizeMode = cc.Sprite.SizeMode.CUSTOM; ``` 此代码片段中加入了对现有组件的检测机制，从而避免了重复添加的操作[^1]。 --- #### 解决方案二：移除旧有组件后再添加新组件 如果确实需要替换现有的某个组件（如 `UIOpacity`），可以在添加之前先将其从节点中删除。具体实现方式如下所示： ```javascript const node = new Node(&#39;box&#39;); this.node.addChild(node); // 如果存在旧版 UIOpacity，则先行销毁 const oldUIOpacity = node.getComponent(cc.UIOpacity); if (oldUIOpacity) { node.removeComponent(oldUIOpacity); } // 创建新的 UIOpacity 并设置属性 const newUIOpacity = node.addComponent(cc.UIOpacity); newUIOpacity.opacity = 128; // 同样处理其他组件... const sprite = node.addComponent(cc.Sprite); sprite.sizeMode = cc.Sprite.SizeMode.CUSTOM; ``` 这种方法适用于那些希望完全控制组件生命周期的情况[^2]。 --- #### 解决方案三：利用脚本管理复杂逻辑 对于更复杂的场景，建议编写专门用于初始化或更新节点状态的工具函数或者类库文件。这样不仅能够提高可维护性和扩展性，还能有效减少潜在错误的发生概率。下面给出一个简单的例子作为参考： ```typescript class ComponentManager { static ensureUniqueComponent<T extends cc.Component>(targetNode: cc.Node, ctor: typeof T): T | null { let existingComp = targetNode.getComponent(ctor); if (!existingComp) { return targetNode.addComponent(ctor); } return existingComp as T || null; } static applySettingsToUIOpacity(targetNode: cc.Node, opacityValue?: number): void { const comp = this.ensureUniqueComponent<cc.UIOpacity>(targetNode, cc.UIOpacity); if (comp && typeof opacityValue === "number") { comp.opacity = Math.max(Math.min(opacityValue, 255), 0); // 防止越界 } } } ``` 随后即可方便地调用这些封装好的功能完成任务： ```javascript const boxNode = new Node(&#39;box&#39;); this.node.addChild(boxNode); // 应用默认配置 ComponentManager.applySettingsToUIOpacity(boxNode, 192); // 追加更多组件定义 const sp = boxNode.addComponent(cc.Sprite); sp.sizeMode = cc.Sprite.SizeMode.CUSTOM; ``` 这种方式特别适合大型项目开发阶段采用[^3]。 --- #### 总结 综上所述，面对 “Can&#39;t add component &#39;cc.UIOpacity&#39;...” 类型的问题，开发者可以根据实际需求选择合适的策略加以应对——无论是简单修改原有流程还是构建更加完善的管理体系都可以很好地解决问题。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值