Refactoring the Youzan Mobile Order Module: Architecture Improvements and Historical Code Transformation

The article describes the refactoring of the order module in Youzan's mobile e‑commerce client to improve maintainability and stability.

It outlines the background: the existing order list served merchants for years but had gaps versus PC experience, prompting a reconstruction project.

From a business‑code architecture perspective, the team split UI into separate views (order status selector, type selector, card list) and encapsulated card sub‑components as reusable widgets, enabling flexible card styles.

Architecturally, they replaced the monolithic AbsTradesListFragment with a ViewModel handling network requests, UI only observing data, and introduced per‑tab pre‑loading and Map‑based initialization parameters to reduce change impact.

For navigation, they addressed iOS/Android component/page switching by adopting a dynamic router component ( DynamicRouterDispatch) that maps old routes like wsc://order/orderlist to new ones ( wsc://order/v2/list) with fallback and alternative templates for graceful degradation.

Historical code improvements covered operation handling distribution (moving click handling to card sub‑components and adding state‑refresh events) and a vertical card design split into independent sections (top bar, customer info, delivery status, goods info, fees, action buttons, city‑delivery status) each with its own ViewModel/View.

The refactor reduced coupling, eased extension, and provided a clear downgrade/gray‑release strategy.