Transforming Taobao Front‑End: The Industry Cube’s Fast‑Track Module System

Introduction

After the 2020 618 promotion, the Taobao front‑end team reflected on its role in large‑scale events and launched a series of articles to share the front‑end contributions. This piece, authored by Xuanhu from the Industry and Workbench teams, introduces the Industry Cube project.

Background

Over the past year, the author supported numerous industry channel front‑end builds, experiencing increasing pressure for rapid site creation and efficient operation. Traditional development remained labor‑intensive, relying on outsourcing and overtime, which degraded code maintainability for long‑tail business channels.

Tools and Foundations

Leveraging Taobao’s accumulated front‑end assets—such as the Tianma building system, the cross‑platform Rax 1.0 framework, and the imgcook intelligent generation tool—developers can now construct modules and entire mini‑program channels more efficiently. Collaboration with UED and product teams also produced the TaoUI component specification and the Weave Component Center.

Industry Cube Concept

By adhering to a standardized component model and driving UI directly from data models, many generic modules can be assembled without custom code. This idea gave rise to the Industry Cube project.

Implementation and Results

Since late last year, the Industry Cube has delivered a set of reusable modules that supported seven Taobao/Tmall industry channels and the fashion industry’s mixed‑feed marketing scenario, significantly easing development pressure. These modules introduced data‑driven UI: operators configure data sources and material themes via a DSL on the building platform, which then orchestrates data fetching and component assembly.

The solution performed well for several months, but four key issues emerged:

Operators must configure both data‑source parameters and material information simultaneously; the complex schema makes the process cumbersome and poorly extensible.

As TaoUI component usage grows, customization points increase; while themes allow business‑specific styling, generic modules cannot forward all parameters to components.

Current data fetching occurs on the front‑end, causing severe performance bottlenecks when many sources or complex mixing rules are involved.

Rax’s mini‑program compilation does not support dynamic import of components, preventing the integration of external business‑specific components.

Future Evolution

To address these challenges, the team proposes three adjustments:

Configure components via themes (a collection of element styles) that support business customization, resulting in the Weave Component Configuration Platform.

Co‑build data pipelines with backend teams, moving DSL‑driven data‑source retrieval, mixing, and pagination to the server, allowing front‑end modules to focus solely on rendering.

Establish a self‑built Weave Module Workshop (Industry Cube) platform for configuring data sources, material themes, and publishing DSLs and production modules.

Current Impact

The updated solution now powers the Tmall fashion industry’s 618 venue, delivering richer mixed‑feed experiences that delight shoppers both in purchasing and browsing.

Future Vision

Although still in its early stage, Industry Cube aims to become a systematic platform that transforms data directly into compliant, tonal channel modules, enabling rapid site creation and frequent iteration. Its data‑driven approach also facilitates fine‑grained operations such as A/B testing of different data‑material combinations, allowing algorithms to dictate UI.