Slide 1
Slide 1 text
Aman Tonk September 11, 2025
Breaking Up
with WebViews
Server-Driven UI with Kotlin Multiplatform
1
Slide 2
Slide 2 text
2
Aman Tonk
Android Engineer AmniX
About Me!
Slide 3
Slide 3 text
3
3
3
1 Webviews and their pros & cons
2 How Server Driven UI can help
3 Sample SDUI framework with KMM
4 Scale SDUI to production
Outline!
Slide 4
Slide 4 text
WebViews!
Question: What Are
WebViews?
Simplest ever Answer: An
Android view that shows
web content right inside
your app.
4
Slide 5
Slide 5 text
5
5
5
Why WebViews?
β Fast Updates
β Cross-Platform
β Cost-Effective
β Web Ecosystem
Slide 6
Slide 6 text
6
6
6
Thoughts? π€
Slide 7
Slide 7 text
7
7
7
WebView Cons
β Runs slowly and uses a lot of
memory.
β Feels laggy and not so smooth.
β Cannot fully use phone
features.
β Debugging is difficult.
Slide 8
Slide 8 text
8
8
8
Security Concerns!
β Open to web attacks.
β Can leak sensitive data.
β addJavascriptInterface, Web
code can control the app
β Blind trust: You must fully trust
the developer.
Slide 9
Slide 9 text
9
9
9
Security Concerns!
Slide 10
Slide 10 text
10
10
10
WebViews: A Liability
Slide 11
Slide 11 text
11
11
11
What is the alternative?
β Native apps are faster and
smoother than WebViews.
β But we still need dynamic
updates and experiments.
β Server-Driven UI combines
native performance with
dynamic content.
Slide 12
Slide 12 text
12
12
12
What is SDUI?
The server sends a UI schema, and the
app renders it with native widgets.
β The server describes the UI, the
client maps schema to real views
and shows them
β Instant updates across platforms.
Slide 13
Slide 13 text
13
13
13
Slide 14
Slide 14 text
14
14
14
The Core Principles
β Server controls the app.
β Not just what to show,
but how, when, and
what actions to take.
β The app just receives
instructions and acts.
Slide 15
Slide 15 text
15
15
15
Client-Side & Data Exchange
β The app has a library of
native UI components.
β The server sends UI as
simple JSON.
β App will map json to UI
β Defines actions for user
interactions.
Slide 16
Slide 16 text
16
16
16
SDUI v/s WebViews
WebViews Limitations SDUI Benefits
Security Vulnerabilities
Store sensitive logic
on the server, minimizing vulnerabilities in
client-side code.
Performance Issues Native Performance
Maintenance Headaches & Increase
Client-Side Complexity
Reduced Client Complexity &
Centralized Maintenance
Limited Personalization Dynamic Personalization & Efficient A/B
Testing
Cross-Platform Inconsistencies A single backend manages UI structure
across Web, iOS and Android ensuring an
uniform experience.
Slide 17
Slide 17 text
17
17
17
Slide 18
Slide 18 text
18
An SDUI Framework
With
Kotlin MultiPlatform
Slide 19
Slide 19 text
19
19
19
But, Why KMM?
β Why not? As an Android dev,
Kotlin is home.
β Remains Native for Android
β Write code once, run it
everywhere.
β SDUI is hard enough, donβt build
it twice.
Slide 20
Slide 20 text
20
20
20
KMP + CMP: A strong combo
β Shared UI + logic on Android and
iOS with native speed.
β Android stays 100% native.
β Mature ecosystem.
β Add platform-specific code
when needed.
β iOS is stable, ship confidently.
Slide 21
Slide 21 text
21
The Architecture with KMM
Slide 22
Slide 22 text
22
From Server to Screen
β Server sends the UI JSON
β Kotlinx serialization parses it
β A type-to-component resolver
β Memory level state management
β Compose then draws the
resolved components to the
screen.
Slide 23
Slide 23 text
23
From Server to Screen
β Components handle interaction
events.
β Events go back to the server or
are handled locally.
β Default UIs and values are
applied during mapping.
Slide 24
Slide 24 text
24
Enough Talking,
ShowMeTheCode()
Slide 25
Slide 25 text
25
First letβs see,
Whatβs not SDUI
Slide 26
Slide 26 text
26
This is NOT SDUI
Slide 27
Slide 27 text
27
This is SDUI
Slide 28
Slide 28 text
28
This is SDUI
Slide 29
Slide 29 text
29
Slide 30
Slide 30 text
30
30
30
β Here are the basic data
transfer objects.
β Some fields are
required, others are
component-specific.
β The list can grow as
needs evolve.
DTOs
Slide 31
Slide 31 text
31
31
31
β Here we will deserialize
JSON to our DTOs.
β Use kotlinx.serialization
β We will have a pseudo
validation layer
β Error handling
Serialization
Slide 32
Slide 32 text
32
32
32
β Kept it simple.
β Check for data not
supported in this SDUI
version.
β The resolver decides to
render or skip based on
severity.
Validation
Slide 33
Slide 33 text
33
33
33
β SduiMainComponent is
the main entry point.
β It receives the parsed
DTO.
β Rendering uses a plain
type-based mapping.
Entry Point
Slide 34
Slide 34 text
34
34
34
β Sample SDUI rendering
β Types are already
validated by the
validation layer.
β Use the mapped native
widget for the
component type.
TextComponent
Slide 35
Slide 35 text
35
35
35
β Serializable style object
β Layout and typography
β Visuals: color, borders,
shadows
β Flex and responsive
sizing
Styling
Slide 36
Slide 36 text
36
36
36
β Sealed, serializable
action model.
β JSON maps to specific
action types.
β Supports chained
actions.
Actions
Slide 37
Slide 37 text
37
Letβs Assemble everything.
Now, witness the demo.
Slide 38
Slide 38 text
38
38
38
Sample Code
Slide 39
Slide 39 text
39
How we could scale SDUI
to production
Slide 40
Slide 40 text
40
Create your own SDUI library
β Plenty of open-source
options.
β Use your design style.
β Get designers
involved.
β Make many widgets.
Slide 41
Slide 41 text
41
Design a Json Schema
β Schema enables
pre-validations.
β Server manages
schema.
β AI can build UIs.
β Support schema
versioning.
Slide 42
Slide 42 text
β QA, Design, Product review first.
β Desktop app preferred.
β Playground should give clear
errors.
β Works with current dashboards.
β Multiplatform support
42
Playground to test
Slide 43
Slide 43 text
43
Start with smaller parts
β Not all screens can use SDUI.
β Use for onboarding, signup,
feedback.
β Then highly dynamic screens
(like home or after sale).
β Add analytics for better tracking.
Slide 44
Slide 44 text
44
Security & Compliance
β SDUI is for UI only.
β Never send sensitive data (like
API keys).
β Encrypt data and reuse app-side
variables.
Slide 45
Slide 45 text
45
Compatibility Testing
β New vs old SDUI library versions.
β Server matches schema to app
version.
β Avoid breaking changes.
β Minimize fallback UI usage.
Slide 46
Slide 46 text
46
Success stories
Who uses SDUI?
Slide 47
Slide 47 text
47
Reddit
Reddit uses SDUI for its
feed, fetching layout
JSON from the backend
to render UI dynamically.
Source
Slide 48
Slide 48 text
48
Netflix
Netflixβs Tudum platform
uses SDUI to deliver
content for web, mobile,
and TV devices.
Source
Slide 49
Slide 49 text
49
Airbnb
Airbnb uses SDUI for its
listing screen so it can
iterate faster without
waiting for app updates.
Source
Slide 50
Slide 50 text
50
And moreβ¦
Other companies like
Lyft, Yelp, Yandex,
Delivery Hero, and
RapiPay also use SDUI in
their apps and benefit
from easier UI updates.
Slide 51
Slide 51 text
51
The Future
β AI-Powered UI
β Hyper-Personalization
β Seamless Apps
β More Adoption
Slide 52
Slide 52 text
52
Integrating with AI Systems
β AI creates or updates UI schemas instantly.
β Uses context like location and device status.
β UI changes ahead of user needs.
β Supports real-time, data-driven optimization.
β Blends analytics and ML for the best user UI.
Slide 53
Slide 53 text
53
Breaking Up for a better future
β WebViews: quick but risky
long-term.
β SDUI: agile and secure.
β KMP + Compose: best native
SDUI.
β Embrace SDUI for better apps.
Slide 54
Slide 54 text
Thank you
Questions? Contact
[email protected]
Curious to dive
deeper? Please
scan the QR Code
for a detailed blog.
Slide 55
Slide 55 text
55
Appendix
β Detailed Blog
β Github Repo of the Sample
β SDUI Sources: Lyft, Yelp, Yandex, Delivery
Hero, RapiPay