Elixir Wizards

SDUI at Scale: GraphQL & Elixir at Cars.com with Zack Kayser


Listen Later

Zack Kayser, Staff Software Engineer at cars.com, joins Elixir Wizards Sundi Myint and Charles Suggs to discuss how Cars.com adopted a server-driven UI (SDUI) architecture powered by Elixir and GraphQL to deliver consistent, updatable interfaces across web, iOS, and Android.

We explore why SDUI matters for feature velocity, how a mature design system and schema planning make it feasible, and what it takes, culturally and technically, to move UI logic from client code into a unified backend.

Key topics discussed in this episode:
  • SDUI fundamentals and how it differs from traditional server-side rendering
  • GraphQL as the single source of truth for UI components and layouts
  • Defining abstract UI components on the server to eliminate duplicate logic
  • Leveraging a robust design system as the foundation for SDUI success
  • API-first development and cross-team coordination for schema changes
  • Mock data strategies for early UI feedback without breaking clients
  • Handling breaking changes and hot-fix deployments via server-side updates
  • Enabling flexible layouts and A/B testing through server-controlled ordering
  • Balancing server-driven vs. client-managed UI
  • Iterative SDUI rollout versus “big-bang” migrations in large codebases
  • Using type specs and Dialyxir for clear cross-team communication
  • Integration testing at the GraphQL layer to catch UI regressions early
  • Quality engineering’s role in validating server-driven interfaces
  • Production rollback strategies across web and native platforms
  • Considerations for greenfield projects adopting SDUI from day one
  • Zack and Ethan's upcoming Instrumenting Elixir Apps book
  • Links mentioned:

    https://cars.com

    https://github.com/absinthe-graphql/absinthe
    Telemetry & Observability for Elixir Apps Ep: https://youtu.be/1V2xEPqqCso
    https://www.phoenixframework.org/blog/phoenix-liveview-1.0-released
    https://hexdocs.pm/phoenix_live_view/assigns-eex.html
    https://graphql.org/
    https://tailwindcss.com/
    https://github.com/jeremyjh/dialyxir
    https://github.com/rrrene/credo
    GraphQL Schema https://graphql.org/learn/schema/
    SwiftUI https://developer.apple.com/documentation/swiftui/ 
    Kotlin https://kotlinlang.org/
    https://medium.com/airbnb-engineering/a-deep-dive-into-airbnbs-server-driven-ui-system-842244c5f5
    Zack’s Twitter: https://x.com/kayserzl/
    Zack’s LinkedIn: https://www.linkedin.com/in/zack-kayser-93b96b88 

    Special Guest: Zack Kayser.

    ...more
    View all episodesView all episodes
    Download on the App Store

    Elixir WizardsBy SmartLogic LLC

    • 4.9
    • 4.9
    • 4.9
    • 4.9
    • 4.9

    4.9

    22 ratings