Platformization of JD's Tongtian Tower: JDReact Integration and Architecture Overview

Tongtian Tower is an activity and channel building system within JD Mall that enables operators to create and launch pages without developer involvement, using a floor‑based layout with rich style variations.

The system consists of two main components: a content management platform for submission, material handling, and intelligent BI placement, and a rendering style management platform (CMS) that provides visual, WYSIWYG configuration and adapts to JD App native, H5, and other channels.

As customization demands grew across interaction, visual design, and backend interfaces, JD decided to transform the system into a platformized solution that can incorporate diverse technical resources.

After six months of effort, Tongtian Tower now supports open APIs for both floors and full pages: H5 full pages and JDReact full pages can be freely customized, and floors can be customized via backend data, native, H5, or JDReact implementations, with CMS tools for development, integration, gray release, and deployment.

Floor style platformization offers a drag‑and‑drop UI that simplifies channel activity construction, aiming to support native, H5, and JDReact floor technologies and to continuously improve the management interface.

Data interface platformization allows operators to customize interface data for each floor and register it on the Tongtian Tower interface platform.

Full‑page open decouples style and data, letting users select floors from a style repository and data from backend services, while also providing native, JDReact, and H5 full‑page creation and publishing tools.

JDReact is a core front‑end technology in the platform, offering three support systems: front‑end support (containers, communication, updates), development support (scaffolding, debugging, packaging), and backend support (activity management, automated packaging, gray release, monitoring). The JDReact package (JSBundle) includes JSBundlePath, AppName, ModuleName, initData and is downloaded in real time without pre‑download, avoiding app‑release constraints.

Configuration of a JDReact package requires specifying fields such as appName, moduleName, git address, and minimum JDReact SDK version.

The build process is driven by Jenkins: a job is created, the source is pulled, dependencies are installed, the JDReact build script generates a ZIP package, which is uploaded to cloud storage, and the result is reported back to CMS with email notifications.

Whole‑package vs split‑package: split packages separate core and business components to reduce bundle size, while whole packages are used when splitting is not supported (e.g., H5 pages).

Floor‑level JDReact enables reuse of stable floors while allowing custom JDReact floors, with options for one JSBundle per floor or a combined bundle for multiple floors, each having trade‑offs in flexibility and performance.

Client loading flow includes fetching native and JDReact floor information, rendering native floors, placeholder rendering for JDReact floors until the JSBundle is ready, then initializing the RN engine, loading the bundle, and rendering the specified template.

Data binding for floors supports free JS download, platform‑driven data injection, and optional caching for reusable floor components.

In summary, the Tongtian Tower platformization vision and JDReact technical summary aim to attract more technical contributors, improve the end‑to‑end development, debugging, gray release, and publishing workflow, and invite developers to provide feedback and join the effort.