에스티 Android 앱의 목록 화면은 제품을 보여주는 데 있어 핵심적인 부분이었지만 코드 변경이 빠르게 진행되면서 복잡하고 유지하기 어려워졌습니다. 이를 해결하기 위해 팀은 "Macramé"라는 새로운 아키텍처를 구현했습니다. 이 아키텍처의 핵심은 불변의 State 개체로 데이터 모델을 나타내고, StateFlow를 통해 UI에 전달됩니다. 데이터 업데이트는 이벤트에 의해 처리되며 핸들러에서 처리하고 상태 또는 사이드 이펙트 업데이트를 처리합니다. ListAdapter와 RecyclerView는 비동기 UI 변경을 처리합니다. 단위 테스트 커버리지가 크게 증가하여 비즈니스 논리를 위한 간단한 핸들러의 사용을 확인했습니다. 일부 화면에서는 약간의 보일러플레이트와 복잡성이 있지만, 이 아키텍처는 코드 유지 가능성과 성능을 개선합니다. 콘텐츠 첫 번째 표시 시간이 18% 감소하여 사용자 참여도가 증가했습니다. Android 팀은 이제 Macramé의 사용을 다른 앱 화면, 예를 들어 카트와 샵 화면, Jetpack Compose로 작성된 곳으로 확장하고 있습니다.
etsy.com
Macramé: Untangling the Knot on the Etsy Android Listing Screen
