How Cube Mini‑Program Engine Delivers Fast Startup, Low Memory, and Rich Features

Cube Rendering Mini‑Program Overview

Cube is a lightweight mini‑program technology stack designed for fast startup, small package size, and low memory consumption, making it ideal for "use‑and‑go" scenarios across Android and iOS.

Module Composition

Components : Standard mini‑program components.

Layout : Supports Inline, Block, Flex, Inline‑Block, Inline‑Flex, and performs text tokenization and line breaking.

Style : Handles style parsing, matching, inheritance, pseudo‑classes, and pseudo‑elements.

Rendering : Manages the render tree and image resource scheduling.

Animation : Implements JS and CSS animations.

JS Bridge : Bridges to the JS engine.

JS Engine : Supports V8, JSC, and QuickJS (Android uses V8/QuickJS, iOS uses JSC).

Compositor : Handles layer composition (in development).

Thread Model

Bridge : Executes JS and handles JS‑related events.

Layout : Performs layout calculations, style matching, and maintains the layout tree.

Render : Maintains the render tree, binds data, and manages layers.

Paint : Generates drawing commands.

UI : Dispatches platform events and performs UI layout.

These threads work in parallel, similar to a CPU five‑stage pipeline, enabling asynchronous painting and reducing white‑screen time compared to traditional web engines.

Key Advantages

Small size: core SO is only 2.8 MB; full stack (including Inside SDK, AppX) is about 5.7 MB.

High performance: Near‑native experience.

Low memory: After initialization the stack uses roughly 7.5 MB.

Supports both Android and iOS.

Comparison with Web Engine

Cube provides broader DSL support (AXML, CSS, components, plugins) while offering a smaller package, faster startup, and lower memory usage than typical web rendering.

Technical Evolution

Adapting mini‑programs to Cube involves three steps: embracing web technologies (CSS, components), improving development tools (debugging, profiling, packaging), and optimizing Cube‑specific architecture for better user experience.

New Flow Layout

Beyond the original Flex‑only Yoga layout, Cube now supports Block, Inline‑Block, Inline‑Flex, and other display types, reducing developer constraints.

CSS Stylesheet Support

Older Cube versions only supported inline styles and limited selectors. The new version adds full CSS stylesheet support, style inheritance, pseudo‑classes/elements, attribute selectors, selector grouping, and more, enabling easier migration from web development.

Inline Text (Automatic Tokenization and Line Breaking)

Initial implementations relied on platform‑specific text APIs, causing performance bottlenecks and limited rich‑text features. Inline Text introduces a unified layout engine that supports rich text, image‑text mixing, tokenization, and automatic line breaks with minimal overhead.

div > div.jartto p span.yellow a#t1 {}
.pixel-ratio-2 .web1px::before {}
div:nth-child(2n+1) {}
input[type="button"] {}
#blue,div > div.jartto p span.yellow a#t1 {}

Benchmark results show that Inline Text reduces layout time and improves rendering efficiency.

QuickJS Adoption

While V8 offers top performance, its memory footprint and initialization latency are unsuitable for low‑end IoT devices. Cube adopts QuickJS on such devices, achieving lower memory usage and faster startup. Benchmarks demonstrate significant speedups across various workloads (e.g., +160% on RayTrace, +48.9% on RegExp).

Animation and Multimedia Support

Cube extends support to Video, Canvas, Lottie, and Live Player components, optimized for high frame rates and low memory on low‑end hardware.

Multiple Mini‑Program Modes

Native : Legacy mode, supports only inline styles, highest performance, limited compatibility.

Cube : Evolves from Native, adds full CSS stylesheet support, balanced performance and compatibility.

Shared : Combines Web and Cube rendering in a single bundle, slightly larger size but higher compatibility.

Real‑World Deployments (TV & POS)

On TV devices with limited memory (512 MB) and low CPU (1 GHz), Cube achieves faster startup than legacy single‑page solutions and keeps memory usage under 10 MB. On POS terminals, Cube improves first‑screen startup by over 30%, reaches 50 fps scrolling, and reduces memory consumption by 30%, approaching Flutter performance.

Conclusion

Cube’s rendering engine has made substantial progress in layout computation, styling capabilities, component support, and tooling, delivering strong performance on low‑end and performance‑sensitive devices. Ongoing evolution will further broaden support for diverse IoT scenarios.