App Architecture

Apps built using Median.co are much more than your regular web view app. While the apps still rely on embedded browser engines to render your web content within a native applications, they also can be enhanced by advanced native functionality and features.

The native shell is where Median shines wrapping your web content with native UI chrome, device integrations, and plugin capabilities that a plain WebView wrapper can't provide.

The diagram below shows the three layers of every Median app and how they relate to each other.

The three layers of your Mobile App

Each layer has a distinct role. Understanding how they interact helps you make the right decisions when configuring your app, debugging issues, and choosing which native features to add.

Your web application

Your existing website or web app, served from your own domain. Median makes no changes to your web content — if it runs in a mobile browser, it runs in your app. All existing analytics, feature flags, A/B tests, and deployments continue to work as normal. You maintain a single web codebase for all platforms.

The native app (Median's layer)

This is what Median builds and maintains. It contains two core sub-components; a WebView rendering engine and the Median JavaScript Bridge plus any plugins you've enabled. See the sub-sections below for a detailed breakdown of each.

iOS & Android platform

The host operating system. Median targets iOS 13+ and Android 8.1+, covering all devices that receive active Apple and Google security support. As Apple and Android release OS updates, Median releases app updates to maintain compatibility without the need to manage this yourself.

Inside the Webview

Within the native app, a WebView component hosts your web content. Median's WebView layer contains two distinct sub-components that work together to bridge your web app and the native OS.

JavaScript and CSS compatibility

WKWebView and Android System WebView do not support every browser API. Compatibility varies by OS version. Refer to MDN Web Docs for up-to-date compatibility tables. For methods like Blob and Geolocation, Median provides shim code that translates JavaScript calls into native OS methods automatically.

Native UI

The native app wraps the WebView with platform-standard UI elements. These are built from iOS and Android native components (not HTML) and are fully configurable in the App Studio without touching your web code.

• Status bar - controlled by native OS; color configurable via Median
• Top navigation bar - title, back button, custom action buttons; optional side bar, fully native
• WebView component - your web app renders here
• Bottom tab bar - native tab navigation; dynamic, localizable

Native navigation elements load instantly and respond instantly regardless of your web app's performance, because they're rendered by the OS. They also automatically adapt to platform conventions (e.g. iOS swipe-back gestures, Android back button behavior).

Native Enhancements

Beyond the base WebView, Median exposes three categories of native functionality that turn a simple WebView app into a production mobile experience.

All three categories are integrated via the JavaScript Bridge — you call a single JavaScript API from your web code, and Median handles the native SDK interaction on both platforms simultaneously.

Platform support & WebView compatibility

Android System WebView is a shared component: all apps on the device use the same instance, which means a system update can briefly interrupt apps that are running.

If your app requires isolated rendering, consistent behavior across all Android versions, or freedom from shared-component edge cases, Median can embed GeckoView directly in your binary at the cost of a larger app size.

Checking specific API support

Not every browser API is available in WKWebView or Android System WebView. For detailed compatibility by OS version, consult MDN Web Docs. For open rendering bugs, see the WebKit issue trackerand Chromium Blink tracker.

Performance considerations

App performance is directly tied to web performance. Since your web app runs in the same rendering engine it would in a mobile browser, so any bottlenecks in your web code affect the app equally. There are, however, specific ways the native layer can improve perceived performance.

For debugging performance issues across both layers, see the Development & Test Deep Dive.

Solutions Architecture Services

For teams planning a complex integration or migrating an existing native app, Median offers guided architecture support.

To book ad hoc architecture services, open the Services tab when viewing your app on the Median platform. Or, contact our Solutions Architecture Team to explore which service best fits your needs.

Frequently Asked Questions

"security": {
    "network": {
        "allowInsecure": false
    }
}