Skip to toolbar

Community & Business Groups

Key Points of the Web Apps Proposal

Background

The World Wide Web stands as one of the most successful platforms in history, built on the principles of openness and universal access. It excels as a platform for distributing documents and information. However, as user expectations on mobile devices have evolved, a significant gap in user experience has emerged between the web and native applications. Users now demand the fluid, responsive, and seamless interactions that native apps provide by default. The web’s foundational model, while perfect for its original purpose, often struggles to deliver this modern, app-like experience, leading to a pressing need for a new approach. This proposal outlines a path forward for an evolved web architecture, one designed specifically for the application era on mobile.

The Challenge: The Web’s Mobile Experience Deficit

The foundational model of the web, based on the real-time loading of fragmented resources (HTML, CSS, JS), is a primary source of performance bottlenecks on mobile. Unlike native apps, which are installed as complete binary packages, web pages must be downloaded, parsed, and compiled on every visit, often resulting in white screens, layout shifts (reflow/repaint), and a generally disjointed user experience.

Here is a comparison of mainstream mobile technologies in terms of rendering and threading differences. As we can see, all mobile frameworks separate the UI and logic processing. Moreover, the frequent updates to the UI by logic and the dynamic nature of the web make web UI more unstable and prone to reflow and repaint.

Technology StackRendering CoreLayout MechanismThreading Model (UI vs. Logic)Layout Stability
Web (Browser)Browser Engine (Blink, WebKit, Gecko)CSS Box Model, Flow, Flexbox, Grid. Highly flexible but easily triggers global reflow.Typically a single-thread model (main thread handles JS, layout, paint). Web Workers can offload computation but cannot directly access the DOM.Low. Asynchronous resource loading, dynamic scripts, and elements without defined dimensions easily cause layout instability (CLS).
Native App (iOS/Android)Native platform rendering pipelines (e.g., Metal/Core Animation on iOS, Skia/HWUI on Android).Dedicated layout systems (e.g., Auto Layout, Constraints, Jetpack Compose). Structured, with clear dependencies.UI operations are strictly confined to the main thread (UI thread). Long-running logic must be handled on background threads.High. Layout is more optimized at compile-time or load-time. Stricter resource management prevents unexpected shifts.
Mini ProgramWebView-based, but logic and view layers are separated.Simplified CSS (WXSS), based on web technologies.Dual-thread model: A View thread (for rendering) and an AppService thread (for JS logic). They communicate via events and data passing.Medium. The separated architecture and packaging mechanism reduce some risks, but the underlying core is still a WebView.
React NativeBridges to native UI components. The new architecture (Fabric) optimizes the rendering path.Yoga engine (Flexbox implementation in C++), consistent across platforms.Three-thread model: JS thread (logic), native UI thread, and a background layout thread (for Yoga).Medium-High. Yoga provides deterministic layout, but the JS-to-native communication remains a key factor.
FlutterSkia graphics engine, draws UI directly without using native components.Proprietary Widget layout system. High-performance, single-pass linear scan.Multi-Isolate model. UI and GPU tasks run on the main Isolate. Heavy computations can be handled in the background via compute or new Isolates.Very High. Has complete control over the rendering pipeline and layout, fundamentally avoiding layout shifts caused by external factors.

Besides performance, Key differences highlight the web’s disadvantages in a mobile context:

  • Loading & Execution: The web’s real-time, fragmented loading contrasts sharply with the pre-installed, holistic nature of native apps. This leads to unpredictable performance and repeated loading waits.
  • User Experience: Native apps offer smooth, animated page transitions (e.g., 300-500ms slide animations) that effectively mask data-fetching latency. The web, by default, presents a jarring “white screen” between page navigations.
  • Interaction Model: Core web features were designed for a desktop-and-mouse paradigm. The click event’s inherent 300ms delay on touch devices, the lack of standardized gesture controls (e.g., swipe, long press), and unstable zooming behavior make the web feel non-native and cumbersome on mobile.

The current W3C motto is to make the web work for everyone. However, functionality is no longer enough. We must shift our focus from pragmatism to “experiencism”—prioritizing the quality of the user experience.

Proposal: A New Architectural Baseline

To bridge the experience gap, we propose the development of a new web core standard focused on high performance for mobile. This new standard should not be seen as a replacement for the existing web, but as a complementary, opt-in baseline for developers building modern, app-like web experiences. It offers a dedicated path for high-performance application development, while the traditional web continues to serve its vital role for content and document-centric sites.

This new baseline should be built on three foundational principles:

  1. Packaged Application Model: We should standardize a packaging format for web applications. Web pages have evolved into complex applications and should be distributed as such. A packaged model, potentially extending the Web Application Manifest draft, would treat the application as a single, coherent unit. This reduces complexity, improves performance, and enables more robust update mechanisms.
  2. Decoupled Architecture (Rendering/Logic Separation): A new standard must endorse and facilitate a multi-threaded architecture where rendering and logic are inherently separate. This is the single most important change required to unlock native-level performance and smoothness on the web.
  3. Rich, Mobile-First Experience Primitives: The new engine must provide a core set of standardized, easy-to-use APIs for functionalities that are currently difficult to implement. This includes:
    1. High-performance page transitions and animations.
    1. A native touch and gesture system (tap, long-press, swipe).
    1. Efficient long-list rendering and virtualization.
    1. Built-in support for mobile UI idioms like pull-to-refresh and safe-area layout management.
    1. Extensibility with binary modules for performance-critical tasks.

Path Forward: Merging and Building on MiniApp WG Success

This initiative is perfectly aligned with the mission of the W3C High-Performance Community Group. To accelerate progress and unify efforts, we propose migrating the charter and deliverables of the W3C MiniApp Working Group into this new, broader initiative.

This approach allows us to reuse and build upon the significant achievements already made by the MiniApp WG, avoiding redundant work. The following specifications provide an excellent foundation:

SpecificationMain FunctionalityKey Technical PointsStatus (2025-05-05)
PackagingDefines package structure and formatZIP container, directory structure, digital signatures, .ma file extensionWorking Draft, Recommendation Track
ManifestProvides metadata descriptionJSON file, 6 required members, 8 optional members, 12 window resource itemsWorking Draft, Recommendation Track
LifecycleManages lifecycle events5 global events, 5 page events, states such as “launched” and “shown”Working Draft, Recommendation Track
AddressingStandardizes URI syntax and resource locationABNF syntax, id/version, dereferencing steps, security considerationsDraft Note, Non-Standard Track

By consolidating these efforts, we can leverage this progress and focus the W3C’s resources on the shared goal of creating a next-generation, high-performance web platform for mobile.

Conclusion: Key Points of the Proposal

To elevate the mobile web, we must move beyond incremental improvements and embrace a new architecture designed for a mobile-first, experience-driven world.

This proposal advocates for:

  • Establishing a new, complementary web core standard for creating high-performance, mobile-first web experiences.
  • Adopting a packaged application model to treat web apps as coherent programs, improving performance and versioning.
  • Implementing a decoupled architecture that separates rendering and logic to ensure a smooth, non-blocking user interface.
  • Standardizing a rich set of mobile experience primitives, including gestures and transitions, to make great UX the default.
  • Merging the efforts of the MiniApp Working Group into the High-Performance Community Group to reuse its existing specifications and accelerate progress.

We hope that more people, whether you agree or disagree with this idea, will join the this group to jointly advance the development of the web.

Leave a Reply

Your email address will not be published. Required fields are marked *

Before you comment here, note that this forum is moderated and your IP address is sent to Akismet, the plugin we use to mitigate spam comments.

*