How Kuikly Achieves Native-Level Performance Across Five Platforms

Background

Cross‑platform development has become a critical focus in the front‑end ecosystem, especially after the launch of HarmonyOS Next, which raises demand for unified development across Android, iOS, HarmonyOS, Web and mini‑programs. Existing solutions struggle to balance three dimensions: cross‑platform capability, performance, and dynamic page updates.

Dynamic‑language frameworks (e.g., React‑Native‑style) offer flexibility but suffer from lower performance, while AOT‑compiled self‑draw solutions (Flutter, JetBrains Compose) achieve near‑native speed but lack runtime dynamism. Kuikly aims to bridge this gap by providing a pure‑native, dynamic, high‑performance cross‑platform stack.

Key Advantages

One codebase for five platforms (Android, iOS, HarmonyOS, Web, mini‑programs).

Native‑level performance through Kotlin Multiplatform (KMP) compilation to platform‑specific binaries.

Page‑level dynamic updates without a heavy engine.

Lightweight, stable, and easy‑to‑maintain architecture.

Production data from Tencent shows Kuikly powers more than 15 apps and 500+ pages, delivering billion‑scale daily page views with comparable first‑frame latency and memory usage to pure native implementations.

Architecture Overview

Kuikly consists of a Core layer written in Kotlin and a lightweight Native rendering layer. The Core layer drives a DSL (declarative + reactive) that generates a platform‑agnostic UI tree, which is then mapped to a native UI tree via a high‑performance BuildTree algorithm.

Core Layer

DSL Engine : Custom declarative‑reactive DSL and, in progress, Compose‑style DSL.

BuildTree : Generates native UI trees using two‑tree mapping, O(1) diff algorithm, and rendering command generation.

Unified UI Components : Re‑implements complex widgets (ListView, ViewPager, Waterfall) in the cross‑platform layer; native atomic components are thin wrappers.

Layout Engine : Integrates the Yoga FlexBox engine for layout calculations.

Native Rendering Layer

Platform Interface : Uniform API surface for Android, iOS, HarmonyOS, etc.

Minimal Native Widgets : Only essential components such as Text, Image, Input, ScrollView are rendered natively.

API Modules : Provide platform‑specific extensions to the Core layer.

Communication between Core and Render layers uses a callKotlin/callNative command protocol, avoiding direct actual/expect dependencies and enabling dynamic updates of the cross‑platform code.

Key Technical Highlights

Two‑Tree Rendering

The rendering pipeline follows four steps: create ViewTree, measure, layout, draw. Kuikly performs the first three steps in the platform‑agnostic Kotlin layer and delegates drawing to the native layer, resulting in a lighter rendering path compared with three‑tree solutions like Flutter or RN.

High‑Consistency Native Rendering

Kuikly adopts native rendering to benefit from mature tooling, native interaction fidelity, and smaller package size, while achieving cross‑platform UI consistency through a thin native layer and extensive high‑order components implemented in Kotlin.

Declarative & Reactive DSL

Inspired by Compose and SwiftUI, Kuikly’s DSL uses Kotlin higher‑order functions and property delegates to provide a concise declarative syntax and automatic reactive updates. Changes in the data model trigger view updates without manual wiring.

Rendering Optimizations

Precise Diff : Custom Kotlin‑based patch generation (if/else, when, for) produces minimal update sets.

UI Flattening : Only visible nodes are kept in the render tree; layout‑only nodes are excluded, reducing measurement and drawing overhead.

Dynamic Updates

Kuikly’s architecture separates cross‑platform code from platform binaries, allowing both static embedding and on‑demand dynamic loading. Android dynamic modules are compiled to native binaries for near‑native speed, while iOS and HarmonyOS use lightweight JS bundles comparable to RN but with lower overhead.

KuiklyBase Infrastructure

KuiklyBase provides the underlying Kotlin‑based tooling required for multi‑platform development, including:

Kotlin/Native support for HarmonyOS.

Cross‑platform base components for the three major platforms.

Full toolchain from scaffolding plugins to debugging, building, publishing, and monitoring.

Stack trace capture and crash reporting for faster issue resolution.

Roadmap

Near‑term : Open‑source HarmonyOS support (May), Web and mini‑program support (Q2), Compose DSL support (Q2).

Future : Expand to desktop platforms (Windows/Mac), improve internationalization, grow community component ecosystem, and continue enhancing performance and developer experience.