Dynamic Cross‑Platform Framework on HarmonyOS: Architecture, ArkVM vs V8, and Performance Optimizations

The Dynamic Cross‑Platform Framework (referred to as “Dynamic”) is a self‑developed solution by JD Finance’s front‑end team that enables a single codebase (business.js) to run on HarmonyOS, iOS, Android and Web, reducing development effort and providing real‑time A/B capabilities while preserving excellent user experience.

Framework Principle – The framework consists of four layers: the business layer (business.js packaged and deployed to the cloud), the virtual‑machine layer (JSCore on iOS, V8 on Android, WebKit on browsers, and ArkVM on HarmonyOS), the communication layer (JSON‑based data exchange across platforms), and the rendering layer (native UI components of each OS).

Exploration of ArkVM – Ark Bytecode is generated by the Ark compiler from TS/JS and executed by the Ark runtime. Although ArkVM can run the bytecode, it cannot directly execute V8‑compatible JS, and business bytecode files must be bundled into the app, preventing hot‑updates. Moreover, ArkVM runs on the UI main thread, causing single‑thread performance bottlenecks and UI‑rendering stalls.

Switch to V8 – Porting V8 to HarmonyOS restores multi‑thread execution and hot‑update capability. V8’s large codebase requires cross‑compilation knowledge (CMake, Clang, LLVM, Ninja). JD collaborated with Huawei to embed V8 into the OS, allowing all cross‑platform frameworks to use the built‑in V8.

High‑Performance Core Solutions

1. Multi‑Thread Architecture – Three threads (JS, Component, UI) work in parallel. The JS thread parses business code into a virtual DOM, sends JSON commands to the Component thread, which creates native components (e.g., ArkTS Button, iOS UIButton). The UI thread handles user interaction and rendering.

// JSON description example
{
    "type": "btn",
    "value": "按钮",
    "childrens": [],
    "id": "238346e885ee",
    "style": { "width": "66px" },
    "attr": { "text-color": "#FFFFFFFF" },
    "event": { "onclick": "myclick()" }
}

2. JSI Integration – Replaces the traditional bridge that serializes C++ objects to strings. JSI maps C++ functions/objects directly to JavaScript, eliminating serialization and asynchronous call overhead, thus improving inter‑thread communication performance.

3. Further Optimization Directions

• Reduce UI hierarchy – HarmonyOS requires an extra wrapper component for custom UI, doubling the hierarchy compared to iOS/Android. Using the C‑API (imperative component creation) bypasses the extra wrapper, aligning hierarchy depth with other platforms and boosting rendering speed.

@Componentexport
struct RomaDiv {
    build() {
        Stack(){
            // use WrappedBuilder to recursively build children
            ForEach(this.childrenTags, (childrenTag) => {
                RomaComponentFactory.builder()
            })
        }
    }
}

• Lower communication cost – JSI already bridges C++ and JavaScript; adding a NAPI layer to reach ArkTS adds conversion overhead. Direct C‑API calls remove this extra layer, reducing latency.

• Shift heavy JS logic to C++ – Moving virtual‑DOM diffing, style calculation, and other intensive tasks from JavaScript to native C++ further improves execution efficiency.

Conclusion – By adopting V8, multi‑threading, JSI, UI‑hierarchy reduction, and native‑logic offloading, the Dynamic framework achieves near‑native performance on HarmonyOS while retaining the flexibility of a single JavaScript codebase across all platforms.