How Yelp Keeps Server-Driven UI Consistent Across Four Platforms

Summary

Yelp maintains two major applications across Web, iOS, and Android, which previously led to fragmented server-driven UI implementations with mismatched backend component representations. To unify its server-driven UI framework, CHAOS, with its cross-platform design system, Cookbook, Yelp built an automated bridge library called Konbini. Konbini reads centralized JSON interface definitions through Jenkins pipelines to automatically generate synchronized libraries for Python, Kotlin, Swift, and TypeScript. These generated libraries handle component serialization on the backend and deserialization on client platforms. To maintain backward compatibility when component interfaces introduce breaking changes, client requests pass versioned spec identifiers, prompting the backend to execute migration methods that downcast newer component models to older supported versions.

Takeaways

1. 1

   Konbini generates four synchronized platform libraries from a single JSON component interface definition: Python for backend services, Kotlin for Android, Swift for iOS, and TypeScript for React on Web.

2. 2

   Automated Jenkins pipelines trigger code generation and package publishing whenever new commits are pushed to the component interfaces repository.

3. 3

   Client requests supply spec version identifiers (such as [email protected]), allowing backend services to invoke migration methods that transform newer component models into versions supported by older clients.