Zalando

How Zalando Transitions to Appcraft: Evolution of Its Server-Driven UI Framework

Original post Transitioning to Appcraft: Evolution of Zalando’s Server-Driven UI Framework

Article Summary

Zalando powers 13 dynamic mobile pages without waiting for app store releases. Here's how they built a server-driven UI framework that ships changes same-day.

Zalando's mobile team evolved from their rigid TNA framework to Appcraft, a flexible server-driven UI system. The shift eliminated versioning headaches and enabled rapid iteration across iOS and Android using Elm architecture and Flexbox layout.

Key Takeaways

Critical Insight

By moving UI logic server-side with primitives and Flex layout, Zalando ships mobile UI changes instantly without app releases or cross-platform coordination.

Continue reading

What This Article Covers

Problem

Zalando's TNA framework required new app store releases whenever they made minor UI changes, like moving a button around. Keeping high-level composed components consistent across iOS and Android was difficult because of versioning conflicts and the constant stream of design variants.

Solution

Zalando built Appcraft using Elm architecture and a Flex layout system. They chose Texture for iOS and Litho for Android. This let them convert server-side Flex definitions into native UICollectionView on iOS and RecyclerView on Android.

Impact

Appcraft meant UI changes no longer required app releases. Engineering effort dropped during app redesigns compared to pages that weren't backend-driven. Incident response got faster too, since they could deploy fixes to the server the same day. The system handled Cyber Week traffic without issues.

The article reveals their custom Appcraft Browser tool and how they're now tackling interoperability between Appcraft and native components.

This page summarizes “Transitioning to Appcraft: Evolution of Zalando’s Server-Driven UI Framework” by Zalando, published May 16, 2024. All credit for the original work goes to the authors.

Read the original on engineering.zalando.com (opens in new tab)

AI tools for iOS

Browse all AI tools →