Cocos Runtime, the technical foundation for mini-game platforms

Mini-Game Runtime

In China, many popular mini-game platforms, such as WeChat, Douyin (TikTok), QQ, and Kwai, have opted for Mini-Game Runtime technology architecture rather than the traditional H5/Webview as their runtime environment.

Similarly, quick game platforms from smartphone manufacturers like Huawei, Xiaomi, OPPO, and Vivo, have unanimously chosen Runtime as their runtime environment.

  1. Why is this the case?
  2. What does the Runtime architecture look like?
  3. What are the pain points of H5/Webview?
  4. In comparison to traditional H5/Webview, what advantages does Runtime offer?

Today, we will take Cocos Runtime as an example and answer the above questions with concrete data.

Advantages of Cocos Runtime

Creating a runnable Mini-Game Runtime solution might not be difficult, but developing a high-performance, low-memory consumption, stable, compatible, low-crash-rate, widely compatible with devices mini-game runtime solution that meets the demands of large-scale commercial operations requires extensive project validation, feature iterations, and meticulous bug fixes.

Led by seasoned experts in the fields of game engines and operating systems, Cocos Runtime has undergone continuous iteration for nearly 7 years, releasing dozens of online versions.

It has supported and served dozens of leading companies in various industries, running thousands of products with installations from billions of users. It is the only Mini-Game Runtime product globally that has undergone extensive commercial validation by both domestic and international giants, and met the extremely demanding stability, compatibility, and device coverage requirements of major companies.

Extended iteration, dozens of different platforms, numerous online project validations, extensive user device coverage, continuous issue fixes, and detailed optimizations have made Cocos Runtime a mature, high-performance, highly available, multiple instances, and secure commercial mini-game and interactive digital content runtime SDK.

Leveraging its ability to harness native system hardware, it can present richer content and faster responses, making the entire gaming experience as closely good as native games.

With its numerous advantages, Cocos Runtime has been widely applied in social apps/e-commerce app mini-game platforms, smartphone manufacturers’ quick game platforms, as well as various fields such as education, live streaming, in-car systems, smart hardware IoT, where on-the-spot interactive digital content is needed.

Cocos Runtime Features

  1. Mature and stable product, validated by thousands of games, installed by billions of users.
  2. High performance, high compatibility, lightweight, supports streaming content loading remotely, enabling instant play within seconds.
  3. Higher security in commercialization aspects.
  4. Rich content sources, compatible with mainstream H5 engines all over the world.
  5. Rapid integration, requiring only a few days.
  6. Supports running multiple Runtime instances simultaneously.
  7. Engine separation support.
  8. WebGL 2.0 support.
  9. WebAssembly support.
  10. Supports multiple operating systems, such as iOS, Android, PC, HarmonyOS, and others.

Cocos Runtime Architecture

To minimize developers’ adaptation costs, nearly all Runtimes in the market follow similar systems in interface and architecture design, gradually forming a set of Runtime standards.

Let’s take the architecture of Cocos Runtime as an example to explore the appearance of mainstream mini-game Runtime architectures.

From the above diagram, we can observe the basic characteristics of the mini-game runtime:

  1. Seamless integration with all H5 engines.
  2. Possesses a core component layer that combines engine technology with operating system technology.
  3. Capable of spanning mainstream platforms.

In the implementation of Cocos Runtime, leveraging the extensive expertise of the Cocos Engine team in engine and operating system architecture cultivated over many years, a lightweight system call layer was crafted using C++. Additionally, a set of essential JS-related interfaces for game execution was implemented using the V8 engine.

This approach not only allows for swift integration with all Canvas-rendered game engines but also exhibits high performance and low power consumption.

Due to the streamlined core of the Runtime, which doesn’t need to consider non-gaming scenarios, it focuses on optimizing performance and experience in gaming scenarios. It provides numerous hardware access interfaces required by games, significantly reducing system overhead and enhancing performance.

H5/Webview Pain Points

Adopting the H5/Webview architecture for mini-game platforms introduces several challenges:

  1. Slow Cold Startup Speed: Switching between multiple games makes seamless transitions difficult.

  2. Memory Restrictions: Being a black box, it is susceptible to system reclamation leading to crashes, making it unsuitable for large-scale applications.

  3. Low Device Coverage: Webview relies on device and system support, with high system overhead, making it unable to cover outdated hardware and low-end devices.

  4. Low Compatibility/High Crash Rates: Different device manufacturers use varying browser kernels, making consistent compatibility challenging and resulting in high crash rates.

  5. Difficulty in App Approval: App stores maintain strict reviews for Apps packaged with Webview, making it easy to be rejected during the approval process.

  6. Content Control Risks: For gaming platforms, there is a business risk associated with developers replacing content, switching payment methods, and altering advertisements after the initial review.

Cocos Runtime vs Webview

Next, we will present a comparison between Cocos Runtime and Webview using some practical data.

Comparison

Test Case

We chose a scenario with a large number of skeletal animated models as our test case.

Project link:GitHub - cocos/cocos-benchmark

Rendering Capability

Even with 2000 units, Cocos Runtime maintains a frame rate of 30.

Memory Consumption

As the number of units increases, Cocos Runtime exhibits the smallest increase in memory consumption.

From the data on low-end device testing below, it is evident that games running on Cocos Runtime achieve a 30% higher frame rate and 10% lower memory usage compared to the H5 version.

Cold Startup Time

In the best-case scenario, Cocos Runtime shows a 40% improvement compared to H5, with an average improvement of 14%.

Cocos Runtime vs Native

Some developers have integrated the Cocos engine with native apps, implementing a sub-game solution. Here, we also have a data comparison.

Trends

Industry experts predict that 2024 will be another year of continued growth for the mini-game market, with popular categories shifting from light casual games to more moderate ones.

During this time, established players in the industry will continue to strengthen their presence, while new entrants will rush to join the fray.

Both major manufacturers and platforms have chosen Runtime over H5/Webview. It is foreseeable that latecomers in the industry will increasingly choose Runtime as the preferred runtime environment for mini-games.

With the imminent opening of TikTok mini-games and YouTube Playable, platforms like Discord and Instagram are closely watching. Facebook Instant Games, which has been cultivated for many years, may also see increased attention.

Furthermore, every country has its own smartphone manufacturers and leading apps. They might draw inspiration from the successful business models of mini-games in China and develop mini-game platforms with their own national characteristics.

It is anticipated that 2024 will be a fruitful year for the mini-game market once again.

For manufacturers and platforms in need of a mini-game runtime, feel free to contact official representatives at Cocos to obtain more detailed information on Cocos Runtime

Click here to visit the official Cocos Runtime product page.

2 Likes

wow, so cool

what a nice article!

1 Like