How We Built a Cross‑Platform Architecture for WeChat Pay on iOS & Android

Background

WeChat Pay faced many client‑side problems because iOS and Android were implemented separately, leading to bugs, poor quality assurance, low scalability, and inconsistent user experience.

Easy to introduce bugs

Quality cannot be guaranteed through communication alone

Poor extensibility, long iteration cycles

Incomplete data reporting

Lack of a solid quality‑assurance system

Missing business and design knowledge accumulation

Loose protocol management

No unified automated testing

These issues caused inconsistent UI, as shown in the pre‑unification checkout screens.

Solution Overview

To solve the core problem of split‑platform implementation and reduce technical debt, a C++ cross‑platform framework was built and the core payment flow was refactored.

WeChat Pay cross‑platform support started from iOS version 7.0.4 and Android version 7.0.7.

Online Metrics

Crash Rate

The crash rate remained stable before and after launch, with no crashes caused by the cross‑platform payment code, providing a seamless experience for users.

Example: sending a red packet uses the cross‑platform C++ code.

Performance Improvement

The core payment flow required 3512 lines of cross‑platform code versus 6328 lines of native iOS code, a reduction of nearly 45%.

New feature development examples:

iOS + Android: 3 person‑days (cross‑platform) vs. >1 week (native) for checkout redesign

iOS + Android: 5 person‑days (cross‑platform) vs. >1 week (native) for simplified checkout

These results illustrate how the architecture improves quality assurance and productivity.

What Is Software Architecture?

Software architecture is the set of components and their relationships. For WeChat Pay, it can be viewed as MVC, MVVM, etc.

Why Architecture Is Needed

Complex business requirements create inherent complexity. Managing this complexity through separation of responsibilities, code reuse, and modular design is the essence of architecture.

Building the Cross‑Platform Architecture from Scratch

Industry typically uses C++ for business logic but lacks a mature architecture for UI and navigation. Simply applying existing patterns is insufficient.

1. Abstract Business Flow

Common patterns (MVC, MVP, MVVM) do not handle business flow and view transitions well. We introduce a UseCase to encapsulate business flow and a UIPage to represent screens, allowing reuse and clearer responsibilities.

Business code aggregates in UseCase instead of scattered across ViewControllers/Activities.

Business flow and UI become reusable.

Fits the complex, multi‑step nature of WeChat Pay.

2. Add a Routing Mechanism

Routing passes data to a router, which parses it and triggers actions such as opening a UseCase, a UI page, a WebView, a mini‑program, or a dialog. The routing data model is defined using UML and later materialized as a Proto protocol.

CGI in this context means a network request similar to HTTP.

Routing unifies flow handling and special‑case processing, reducing duplicated code and errors.

3. Manage Network Requests

Old iOS implementation used a singleton network center with notifications, causing one‑to‑many communication issues and lifecycle bugs.

New design abstracts each request as an independent Cgi object, using the command pattern. A UseCase owns its Cgi, and the Cgi’s lifecycle matches the UseCase’s, preventing stale callbacks.

4. Standardize Data Passing

Eliminate shared mutable models. Pass immutable value types, enforce one‑way data flow, and use dependency injection. When upstream notification is needed, employ the delegate pattern.

This removes data pollution, makes data flow traceable, and improves reliability.

Summary

The essence of software complexity lies in business requirements. Good architecture manages this complexity, solves real business problems, and becomes the foundation for further capabilities such as automated data reporting, duplicate‑payment prevention, and security cross‑cutting concerns.