How Alipay’s Cube Engine Revolutionizes Dynamic Native Pages and Mini‑Programs
This article reviews the evolution, technical choices, architecture, and future roadmap of Alipay’s Cube rendering engine, which enables dynamic native pages and lightweight mini‑programs through a JavaScript‑and‑CSS‑based front‑end solution.
Background
Alipay’s client has progressed through three stages of dynamic technology: a native+web hybrid model, an entity component model mapping HTML/CSS to native components, and finally a hybrid model combining entity components with partial rasterization, of which Cube is the product.
Technology Selection & Evolution
Cube emerged around 2016‑2017 to meet high‑frequency native page updates. The team prioritized independent development and business‑focused, restrained technology, choosing JavaScript as the logic language, a subset of CSS for UI description, and a mixed rendering mode of custom-drawn elements (text/img/div/scroller) plus native components.
JavaScript runs on QuickJS (instead of V8 for lower memory and load overhead), with an optional WebAssembly engine (wamr) for mixed JavaScript/AssemblyScript development. The team rejected adopting RN or Flutter codebases to retain control and reduce productization costs.
Current Status
Cube now powers two main product forms: Cube cards and Cube mini‑programs. Cube cards add region‑level dynamic capabilities to native pages, with simple expression‑based cards and more complex JavaScript‑enabled cards; they have served over 100 billion page views across various Alipay tabs.
Cube mini‑programs target IoT and TV screen scenarios, offering advantages in package size, startup speed, smooth scrolling, and memory usage, though they currently lack full CSS support and mature tooling.
Technical Architecture
Cube consists of two major modules: CubeKit, which interfaces with the JavaScript engine and abstracts platform differences, and CubeCore, a C++ rendering core.
Cube mini‑programs support the tinyApp‑dsl subset, using JSC/ V8 on mobile and QuickJS on IoT; Cube cards use a lightweight Vue‑based card‑dsl. Simple cards are rendered by parsing an AST, while complex cards allow custom JavaScript logic driven by QuickJS.
Both mobile and IoT share a common container code, with ongoing vertical integration to improve performance. On TV devices, Cube mini‑programs run at ~5.5 MB package size, 32 MB memory, and 3‑4 s cold start.
The team built an automated testing framework (KITE) inspired by browser WPT, enabling daily automated inspections of engine capabilities and supporting continuous upgrades without regressions.
Tooling is emphasized as a critical factor for developer adoption, covering debuggers, preview containers, logging, and low‑code platforms.
Review & Future Plans
After five years of challenges, Cube aims to expand into IoT operating systems and further TV screen deployments, while maintaining a business‑centric, technology‑restrained approach.
Explore running Cube cards on 32 MB/400 MHz RTOS devices.
Promote Cube mini‑programs on large‑screen TV platforms and investigate commercial models.
Alipay Experience Technology
Exploring ultimate user experience and best engineering practices
How this landed with the community
Was this worth your time?
0 Comments
Thoughtful readers leave field notes, pushback, and hard-won operational detail here.
