How Alibaba’s Front‑End Evolved: From Demo Pages to Full‑Stack Publishing

1. Publishing

When I first joined Alibaba, front‑end developers delivered demo pages while back‑end engineers wrote Velocity templates to embed the HTML, a cumbersome "page‑wrapping" process that often caused bugs and duplicated effort.

Fortunately, a back‑end colleague built the AWP publishing platform and a CDN origin, pointing the h5.m.taobao.com domain to the CDN, which gave front‑end engineers real publishing capabilities beyond merely delivering static assets.

2. Separation and Isomorphism

The introduction of an API gateway allowed all services to expose APIs through a unified entry point, enabling a new development model where front‑end builds pure static pages that consume the same back‑end APIs as native clients.

This approach solved two key problems: front‑back separation and partial front‑end isomorphism, while sacrificing server‑side rendering—a trade‑off that suited Mobile Taobao’s architecture.

It also led to page‑centric business organization, where each page could switch between Web and Native implementations, laying the groundwork for later solutions like Weex.

3. Extending to the Server

To make full‑stack more approachable for front‑end engineers, we leveraged CDN back‑origin services, which have lower load and are well‑suited for front‑end teams to maintain.

Using CDN for non‑personalized, non‑private data such as global configuration and promotional content proved highly efficient under massive traffic, and even some client teams began to use this static cluster.

4. Extending to the Client

Weex, evolved from WeApp, underwent two major rewrites, shifting from a back‑end‑centric design to a front‑end‑centric one, with contributions from front‑end, Android, iOS, and back‑end developers.

5. Performance

I once claimed that any performance optimization without profiling was dishonest; now I believe any optimization lacking online monitoring is equally misguided.

Performance work must span the entire request chain—from URL to page—including WebView, network, DNS, carriers, and back‑end, requiring measurement, analysis, design, and implementation.

Our stack benefits from technologies like HTTPDNS, SPDY, and ZCache, but success still depends on front‑end owners taking responsibility for results.

6. Tools and Libraries

Initially I undervalued Node, seeing it only as another server solution, but later recognized its tooling ecosystem and the importance of npm‑based toolchains.

Our base libraries evolved from a single base.js to a modular lib series, adhering to single‑responsibility principles, which facilitates performance tuning.

We also integrated tools such as Babel, Sass, Browserify, Uglify, Webpack, and Gulp into a cohesive engineering system, with future plans to combine build, debug, and release functions into an IDE‑like experience.

7. Conclusion

Front‑end development is a rapidly changing discipline; its youth brings both opportunity and growing pains. Reflecting on years of work at Mobile Taobao, we see continual evolution and hope our experiences add value to the broader industry.