From PC to Mobile: Tracing the Evolution of Front-End Development

Review: Front-End History

Front‑end technology has existed for just over ten years. The first decade was dominated by PC front‑end, while the second decade belongs to mobile front‑end.

Stage One: Primitive Tools

More than ten years ago developers struggled with IE6 compatibility; jQuery was the dominant framework, and some used Zepto.js to reduce page size. At that time front‑end was PC‑centric and mobile concepts were absent.

Stage Two: Engineering

From 2011 to 2014 modularization dominated. Module protocols such as AMD (RequireJS), CMD (Seajs) and KMD (Kissy) were popular. KMD led in Taobao/Tmall, CMD in Alipay, while AMD was common abroad but later weakened by CommonJS.

Stage Three: Mobile

With 3G/4G and the massive adoption of iOS and Android, the front‑end mindset shifted from PC to mobile, aiming for app‑like user experiences. HTML5 support was incomplete, resource loading was slow, and Android’s screen fragmentation made mobile page adaptation painful.

Stage Four: Frameworks

Frameworks such as Angular, React, Vue, and React Native appeared, bringing data‑driven concepts and enabling mobile UI upgrades. Weex and Flutter followed, and Alibaba’s Rax leveraged a VDOM to share code across WebView and Weex.

Stage Five: Verticalization

Large‑screen smartphones made mobile demand explode. Front‑end split into consumer‑facing mobile (Web + light‑App) and back‑office (ERP, CRM) scenarios, each with dedicated component libraries and visual design systems.

Mobile Front‑End: The Past and Present of Hybrid Technology

Hybrid applications bridge web and native worlds. Early JSBridge solutions (e.g., Apache Cordova) enabled JavaScript to call native APIs, but suffered performance and component limitations.

Stage One: JSBridge

WebView combined with JSBridge created a communication channel between JavaScript and native code. Apache Cordova became a leading implementation, and many companies built their own JSBridge frameworks.

Stage Two: Native UI

Web standards (W3C) introduced latency, long rendering pipelines, single‑threaded execution, and asynchronous rasterization, causing UI jank and limiting performance on mobile devices.

Stage Three: Self‑Drawing Engine

Flutter (2018) introduced a Dart‑based, Skia‑powered engine that draws UI directly on the GPU, achieving native‑level performance and solving cross‑platform consistency issues. Alibaba’s Kraken extends W3C APIs on top of Flutter without using its widget framework.

Future: Returning to the Roots

Despite diverse solutions, the core of mobile front‑end remains UI programming based on W3C standards. Progressive Web Apps (PWA) bring offline capability, background processes, push notifications, and app‑like UI to browsers. Progressive Hybrid Applications (PHA) further enhance WebView performance, a concept seen in mini‑programs and quick‑apps.

Offline loading via Service Workers

Background processes that survive page close

Push notifications similar to native apps

App‑like installation, full‑screen display, and icon saving

Emerging technologies such as large‑scale data‑driven UI composition, WebAssembly, and AI‑assisted rendering promise even more powerful, personalized front‑ends.