How Rax Is Revolutionizing Multi‑Platform Frontend Development

https://github.com/alibaba/rax

Since its announcement on January 12 at Weex Conf, the open‑source project Rax has attracted over 2400 stars on GitHub, showing strong demand in the frontend and Weex communities for React‑like solutions.

Evolution of Taobao Mobile Frontend

Taobao's front‑end team has always aimed to "use technology to provide unlimited experience possibilities," and Rax was created to pursue that goal.

Starting in 2014, data from Alibaba's Double‑11 and Double‑12 events made it clear that mobile had become the primary business battlefield. Traditional PC‑centric technologies could no longer meet mobile performance and development‑efficiency requirements, prompting a shift toward new mobile solutions.

KIMI

In early 2014, Alibaba's mobile business began with a lightweight core library called KIMI, built on Zepto to replace heavyweight libraries like KISSY and jQuery. KIMI grew an ecosystem of components, engineering tools, and performance monitoring over two years, though it remained a web‑only solution.

Because KIMI could not deliver native‑level experience, the team sought a way to achieve native performance on mobile.

React Web

Writing native code directly solves performance but introduces high cost, low efficiency, and long release cycles due to platform‑specific teams and App Store reviews.

Cost & efficiency: iOS, Android, and Web require separate teams.

Flexibility: App Store review process slows releases.

Facebook's open‑source React Native (initially iOS‑only) dramatically reduced the need for separate codebases and benefited from a vibrant React community. Alibaba experimented with RN in the Taobao app, but compatibility issues and the need for graceful degradation to Web led to the idea of "Write once, run everywhere," extending beyond RN's "Learn once, write anywhere."

This exploration gave rise to the React Web approach.

Rax

In the 2015 Double‑11 period, Weex began to be adopted, proving its feasibility. However, Weex required Vue syntax, which conflicted with the React expertise of many teams. Attempts to combine React with Weex proved too hacky, leading to the birth of Rax: a React‑standard implementation that supports multiple containers, primarily Weex and Web.

Rax Architecture

Rax vs. React

React is a standard; Rax is an implementation of that standard.

Rax is not a replacement for React; it is a solution focused on the mobile/web arena, while Taobao's PC projects continue to use React and the ICE toolchain.

Compared with Preact, which emphasizes performance, Rax focuses on multi‑platform consistency.

Key Features of Rax

1. Supports Multiple Containers

Rax abstracts a "Driver" concept to render on Web, Weex, Node.js, and future containers such as VR, smoothing out platform differences for developers.

For details, see the Rax Driver Specification.

2. Small Bundle Size

After compression and gzip, Rax is about 8 KB, far smaller than React's ~44 KB, making it well‑suited for mobile.

3. Returns Multiple Sibling Nodes

Unlike React, which can return only a single root node, Rax allows an array of sibling nodes, reducing unnecessary nesting and lowering crash rates on low‑end Android devices.

import {createElement, Component, render} from 'rax';
class Test extends Component {
  render() {
    return [1, 2, 3].map(item => {
      return <p>{item}</p>;
    });
  }
}

4. Standardized APIs

Rax follows W3C standards, exposing APIs such as navigator, document, location, and alert directly in the Weex container.

Further standardization remains a long‑term goal.

RAXUI

Built on top of the core rax-components , RAXUI provides a set of official UI components to accelerate module and page development. For example, the Picture component wraps the Image component with optimization and lazy‑loading, while TabHeader enables easy horizontal navigation. RAXUI improves development cost, compatibility, performance, and design consistency, and will be opened to the community soon.

Future Outlook

The slogan "Write once, run everywhere" guides Rax's roadmap, with plans to support VR/AR and even WeChat mini‑programs.

Developers facing an ever‑growing list of platforms must decide whether to maintain exhaustive checklists or explore Rax together.

— The Rax Team

Related Links

GitHub

Issue Feedback

Rax in Taobao Double‑Promotion