Exploring Taobao Transaction Terminal Hybrid Architecture and Performance Optimization

Introduction: The article discusses challenges of delivering deterministic business delivery time and quality under high uncertainty, proposing a hybrid architecture (Native container + Weex 2.0) for Taobao transaction terminal.

Terminology: Defines DinamicX (DX), Weex, Orange/一休, JSTracker.

Basic transaction chain: outlines steps (cart, order, payment, order list, order detail, logistics, refund).

Challenges of pure native development: release efficiency, development efficiency, multi‑platform consistency, fragmentation.

Hybrid architecture benefits: configuration‑driven capabilities, unified runtime control, extensible customization.

Key modules:

Container management – supports Activity and Fragment containers.

Instance management – pre‑heats Weex instances synchronously or asynchronously.

Data management – performs network pre‑requests and caches data.

Resource management – ZCache for HTML/JS/CSS and image pre‑fetch.

Logic management – white‑list and annotation based integration.

Performance improvements: reduced navigation time, container time, request time; P95 first‑screen latency improved up to 70% in order detail and payment success.

Adoption steps:

Configure front‑end page URL with tradeHybrid=true in navigation rules.

Select required optimization modules and write parameters into the common configuration.

Configure Orange switches and 一休 experiments for rollout control.

Configuration examples:

预热配置: [
    {
        业务身份标识,
        预热URL,
        预热时机,
        回收策略,
        销毁策略,
        ...
    },
    {...}
]

预请求配置: [
    {
        业务身份标识,
        预请求时机,
        网络请求配置,
        缓存配置,
        ...
    },
    ...
]

Future outlook: continue optimizing the chain, enrich container types, diversify capabilities, improve multi‑device consistency and intelligent scheduling.