Integrating Cocos Creator 3.0 for 3D Character Customization in an English Learning Community App

Liulishuo developed PIE, an English practice community app, integrating 3D elements to simulate real-life social scenarios. After evaluating multiple options, they chose Cocos Creator 3.0 for its 2D/3D fusion, open-source nature, and mature ecosystem.

Native SDK Integration

To embed the game engine into Android/iOS apps, they abstracted Cocos engine architecture into engine, engine-native, and adapter layers, and chose to integrate engine-native. Their integration process involved forking the engine-native repo, encapsulating it as a reusable SDK with submodule management, and automating CI-based game asset delivery via a dedicated repo.

Cross-Platform Communication via JSB

While Cocos provides jsb.reflection.callStaticMethod for game-to-native calls, it has limitations: platform-specific syntax, tight coupling to native method signatures, and lack of async support. To address this, they implemented a custom JavaScriptCocosKitBridge that unifies cross-platform calls, centralizes dispatch logic via a dispatch method, and supports both synchronous ( callSync) and asynchronous ( callAsync) invocations using callback functions. This decouples game and native code, improves maintainability, and enables consistent APIs across platforms.

Asset Bundle-Based Character Customization

For dynamic 3D character outfitting, they used Cocos Asset Bundles to modularize and remotely host resources (e.g., FBX models, textures) on Alibaba Cloud OSS. The workflow includes: (1) loading the bundle manifest only at startup, (2) downloading and loading specific assets on demand, and (3) caching assets for reuse. They leveraged preloading APIs to shift network and parsing work earlier, optimizing perceived performance while respecting memory constraints. Memory is managed via bundle.releaseAll() to avoid leaks.

Future Work

Despite Cocos Creator 3.0 meeting core needs, they acknowledge technical debt due to its instability. Next steps include upgrading to Cocos 3.2+, optimizing 2D UI components, and resolving memory leaks—especially on low-end devices.