Kuikly Adapts to iOS 26 Liquid Glass: Native Rendering vs Self-Rendering Showdown

Introduction

At WWDC25, Apple unveiled its most significant visual design overhaul in over a decade: Liquid Glass . This new design language uses semi-transparent 3D textures and dynamic fluid effects to create immersive experiences, blurring the line between software and hardware. Its arrival forces a fundamental question for cross-platform frameworks: how should a framework relate to the host system's evolving capabilities?

The article contrasts two architectural paths:

Self-Rendering (e.g., Flutter, Compose Multiplatform): draws all UI via its own engine (Skia) on a system canvas, prioritizing pixel-perfect consistency across platforms.

Native Rendering (e.g., Kuikly, React Native, Hippy): maps framework abstractions directly to native UI components and rendering pipelines, maximizing platform-specific features and performance.

Liquid Glass shifts the debate from performance vs. consistency to ability to track platform innovation . Because Liquid Glass relies on deep integration with Metal and Core Animation, it cannot be easily simulated.

What Is Liquid Glass?

Liquid Glass represents a shift from flat design to immersive design, centered on optics, material, and depth. Its two core characteristics:

Optical properties & dynamic fluidity : UI elements refract and reflect in real time based on background content and ambient light, causing colors and highlights to change dynamically.

Multi-layered interface structure : UI is split into background, content, and floating interactive layers, creating pronounced spatial depth.

These effects are already pervasive in iOS 26: app icons are built from multiple glass layers that adapt to theme colors; Safari's floating toolbar collapses on scroll to maximize content.

Crucially, Liquid Glass is not a visual trick but depends on hardware-accelerated rendering pipelines . It moves UI implementation from software simulation to direct invocation of low-level hardware capabilities, posing a new challenge for cross-platform frameworks.

Architectural Adaptation Analysis

3.1 Self-Rendering Path

Frameworks like Flutter and Compose Multiplatform render everything via their own engine (Skia). While this ensures visual consistency, adapting to Liquid Glass requires custom shaders or image processing to simulate the native effect . The article notes:

Simulation costs are high; performance and fidelity are lower.

Visual alignment with native is difficult to achieve.

Every future platform innovation that relies on system-level depth, lighting, or dynamics will again require costly simulation.

A Flutter community discussion captures the sentiment: "The cost and difficulty of re-implementing various design languages is getting higher and higher." This reflects the core trade-off: absolute cross-platform visual consistency at the expense of high engineering cost to chase platform-specific innovations.

3.2 Native Rendering Path

Kuikly, Hippy, and React Native map high-level abstractions to native UI components. When Apple releases Liquid Glass, these frameworks can directly call the new system APIs to give their components the effect.

Advantages:

Lower adaptation cost : mainly wrapping native APIs and exposing them at the framework layer.

Higher fidelity : visual and performance parity with native apps because the same system renderer is used.

Sustainable evolution : the architecture naturally stays in sync with host platform innovations; future updates can be integrated via the same path.

For Kuikly, native rendering's value extends beyond UI rendering—it ensures the framework stays synchronized with the host platform's technical evolution, letting Kuikly-based apps continuously adopt system-level innovations at low cost.

Kuikly's Adaptation Experience

4.1 Adaptation Principles

Kuikly balances its core philosophy— composing atomic components via Kotlin cross-platform layer to maximize UI consistency —with Liquid Glass's platform-native emphasis. The decision: prioritize user experience, embrace platform characteristics pragmatically. Cross-platform consistency means providing a quality experience that matches user habits on each platform, not pixel-for-pixel identity. Common components are unified at the cross-platform layer; platform-specific advanced components (e.g., complex overlay animations) are handled via custom components.

4.2 Developer-Friendly API Design

For common components like View and Button, Kuikly adds a concise view attribute extension rather than introducing new components. A single line enables Liquid Glass:

View {
    attr {
        glassEffectIOS() // iOS platform automatically adds Liquid Glass effect
    }
    // ... other child views
}

This avoids platform-specific if/else blocks in UI code. The framework handles platform differences internally: on supported iOS versions the effect is enabled; on other platforms or older iOS versions it gracefully falls back to default styling.

4.3 Adaptation Strategies & Technical Implementation

Differentiated strategies per component type:

Basic components (View, Button): adapted via native attribute extensions. Also provides standalone LiquidGlass and LiquidGlassContainer components (similar to BlurView) for flexible layouts.

Complex composite components (Input, AlertDialog): support composition effects so businesses can opt-in at low cost.

iOS-exclusive components (Slider, Switch): these gain brand-new dynamic effects in iOS 26. Kuikly adds iOS-specific component wrappers at the render layer to ensure full native interaction fidelity. At the DSL layer, platform differences are hidden; developers simply add enableGlassEffect(true) to existing component usage.

Switch {
    attr {
        isOn(true)
        enableGlassEffect(true) // iOS 26.0+ automatically renders as native Switch
        thumbColor(Color.WHITE)
        onColor(Color.BLUE)
        unOnColor(Color.GRAY)
    }
    // ...
}

4.4 Compatibility Guarantees

Legacy iOS compatibility : wrapped native components automatically fall back to previous styles on older iOS versions. Composite components also include compatibility guards, so business code need not worry about crashes on old systems.

Cross-platform compatibility : Liquid Glass code automatically degrades to default implementations on Android and other unsupported platforms, eliminating the need for platform-check logic in business UI. Developers can adopt the latest design language on iOS while maintaining a single codebase for other platforms, drastically reducing development and maintenance overhead.

Conclusion & Outlook

Liquid Glass serves as a case study to re-examine the two core cross-platform paths: abstract and flatten platform differences vs. integrate and leverage platform capabilities . Historically, the challenge was consistency. But as OS capabilities advance—from spatial computing to hardware-accelerated AI—the cost of abstraction may become the cost of missing the platform's most valuable innovations. A framework's value increasingly lies not in what it flattens, but in what it unlocks.

Kuikly's Liquid Glass adaptation is not merely a feature catch-up; it validates a possibility: true cross-platform development need not sacrifice deep platform characteristics, and can instead turn native innovation into its own advantage. For developers, choosing a cross-platform framework is both an engineering trade-off and a strategic decision about whether their app can stay competitive on evolving platforms. Through deep integration with the native ecosystem, Kuikly aims to help developers continuously create exceptional app experiences atop ever-evolving platforms.

Source code and further details are available at the Kuikly GitHub repository: https://github.com/Tencent-TDS/KuiklyUI.