Cocos Creator 3.7.0 Brings More Improvements
2023.01.29 by COCOS
Cocos Creator Version Updates

Cocos Creator 3.7.0 is another milestone on our path of constantly challenging and improving ourselves. In order to support a larger, and more realistic 3D world, we have made improvements in rendering effects, global illumination, LOD, animation systems, physics systems, and performance in this version. There are large numbers of updates in V3.7.0, so only important ones are listed here. You can also view the update list in our GitHub repository:GitHub update list

Rendering

Light probes

For a more realistic 3D world, global illumination on dynamic objects is needed. Unlike lightmaps that only support indirect light baking on static objects, light probes are used to apply indirect lighting on characters or other dynamic objects. Light probes capture light information in the space first, and then apply the approximation on the dynamic objects. This approach has advantages of good processing performance at runtime and fast precomputation. For more details, please read our document: Light Probe.

Characters with light probes:

Spheres using light probes with instancing:

Light probes editing:

 

 

 

Reflection probe

Another technique we introduced in 3.7 to improve rendering result is reflection probe. Especially for the scenes with reflective materials, reflection probe improves the immersive feeling dramatically. Reflection probes take a baked result of the nearby environment from a certain point, and store a texture of the surrounding environment. Then apply this texture on the objects that have reflective materials to achieve a realistic look. There are two modes: a cube mode that requires baking of the surroundings, and a live planar reflection mode used mainly for planar surfaces like floors and water. For more details, please read our document: Reflection Probe.

Level of Details (LOD)

Level of Details (LOD) is a technique that reduces the number of GPU operations needed to render distant meshes. LOD is a common way to improve the performance of large scenes by adjusting the precision for models according to their proportion on the screen. It saves rendering resources by displaying low precision resources when objects are far from the camera. When a node uses LOD, the engine would display the appropriate LOD level based on the screen size . For more details, please read our document: Level of Details.

 

CSM layer transition

The purpose of CSM is to use different shadow resolutions for different layers. A problem this leads to is that the layer switching point could be easy to spot and it makes the shadow looks unnatural. In 3.7, we added support for a smooth blend transition between layers, so CSM layers switching looks more natural.

 

Post effects:Bloom & FXAA

We introduced Bloom post effect and FXAA on the new customized render pipeline that based on RenderGraph. Unlike the old render pipeline which is hard to customize, the new one is designed for users to customize and expand features easily. Adding post effects like Bloom is never been this easy as well.

 

Editor

Native engine for the Editor (experimental)

We support native engine for the scene editor in V3.7.0, scene editor can run with the C++ based Windows/Mac native Cocos engine instead of JS/WebGL based HTML5 engine now. This means scene editor's performance can improve to the next level with native advantages. It better prepares users for the larger 3D world. This feature currently is in experimental stage. You can turn it on with the option "Use native engine for scene editor" at menu Preferences - Laboratory. After it is turned on, you can preview and debug with multiple native viewport.

 

All-new extension manager

We updated extension manager in V3.7.0. This all-new extension manager added support for extensions hot update, Project dependencies auto install, improved UI, and update version selection. It makes project distribution and extension management easier.

For better version control, we updated some rules for extension management:

  1. No longer reading global extensions from global folder. For projects on older versions, it would automatically copy all the global extensions into the project on update time. This migration feature is supported with Dashboard 1.2.4. Please make sure Dashboard is automatically updated to the version 1.2.4 before the project update.

  2. Project's extension dependencies would be recorded. If a project is opened from Dashboard version 1.2.4 or above, dependencies would be installed automatically. For now, only official extensions are supported, extension from store will be supported in later versions.

  3. For extensions that is under development, users can use the Developer Import button to create soft links for external extensions which are under development. This feature allows extension developers to use an external extension directly without copying them to the project.

  4. If you need to share extensions from the store, it is the same as previous version. Users need to install extension manually on a different device, or upload extensions to GitHub.

 

Splash settings update

Splash settings are used to display Cocos or your brand's logo during the game initiation time. At the same time, we optimized the first screen loading time to improve user experience. From version 3.7, we started to renew some previously under maintained features based on the users' feedbacks, such as Splash settings. Here are the main updates:

  • Temporary removed the user questionnaire interface, users can switch on/off for the splash display.

  • Removed splash background color setting. Currently it only support black.

  • Minimum display time for splash updated to 500ms

Project setting interface:

Building interface:

 

Resource management

  • Support compressed textures to use Mipmaps. After the option is turned on, the editor would automatically generate mipmaps with compressed textures, and then export at the same time.

  • Added support for the .exr image format.

  • Support green channel flip config option for the image assets.

  • After moving or renaming the ts script in the editor's explorer, editor would automatically updates the import path now. To enable this function, please enable this switch in the Laboratory section of Preferences.

  • Added new mesh optimizer face reduction algorithm: simplify. New algorithm does not change prefab structures, and improved face reduction result for fbx.

 

Mesh UV inspector

In 3.7, users can inspect UV for different channels in the property inspector. Now you can just simply select the imported mesh to inspect uv channels to see weather it is within (0,1) space or if it has overlap.

 

Framework

Marionette animation system

  • Added a new animation asset type: animation variants, it enables the reuse of the same animation graph on different characters.

 

  • Introduced improved animation state machine 2D blend preview panel

  • Animation state machine now supports node copy feature.

  • Class AnimationController added a method to dynamically overwrite animation clips in the animation map.

  • Class AnimationController added a method to query the number of layers in the animation map.

  • Animation diagram editor: add a right-click menu to change the motion state to sub-statemachine state

  • Fixed and optimized some status query method

Particles system performance optimization

Updated CurveRange building logic, deferred building curve data, and optimized internal decorators to improve particles system initialization speed.

3.7 and 3.6 Particles initialization speed compare (The shorter, the faster, and more modules the particles use, the more time it saves in 3.7).

Other performance optimization

Besides the improvement on performance of the particles system, we also improved performance for other modules, such as those listed below:

Note: In the the performance testing result graphs below, we increased the load for each platform step by step during the testing. Different platforms might have a different load increase step. The performance result shows in frames per second, therefore, higher value means better performance.

  1. Frame animation

  1. 3D model rendering

  1. 3D physics