BFF 사용 사례

화면 단위 복잡성을 흡수하다: 여기어때 BFF의 기록

• MSA 환경에서 한 화면에 필요한 API 조합을 BFF에서 처리

WebFlux와 코루틴으로 BFF(Backend For Frontend) 구현하기 - 카카오페이

• 백엔드에서 전달한 raw 데이터를 프론트엔드 친화적으로 가공해서 전달 (BFF가 프론트엔드의 책임을 대신하여 데이터를 제공)
  • 프론트엔드에서 데이터를 가공하면 사용자 기기의 자원을 쓸수있어서 좋지만 모바일의 경우 배터리 소모 문제를 고려해야할수도 있음
  • 복잡도 관점에서 프론트엔드가 UI로직에 집중할 수 있도록 하기 때문에 유지보수와 캡슐화 관점에서 이익이 큼
• API 조합기 역할
  • MSA 환경에서 API조합기 역할

BFF를 사용하지 않을때

• 모바일의 경우 인터넷 지연시간이 LAN보다 100배는 더 김.
• 느린 네트워크를 통해 왕복 3번의 통신이 필요
• 서비스별로 각각 인증을 거쳐야함

BFF를 사용할때

• 프론트엔드는 BFF로만 통신
• BFF는 방화벽 내부, 고속 LAN 환경에서 통신하기때문에 더 빠르게 데이터를 받아올 수 있음
• 인증 1번
• 캐시를 적용할때 쉽게 반영할수 있다는 장점이 있음

GraphQL

프론트엔드에서 질의를 통해, 자신에게 필요한 데이터를 백엔드로부터 질의해오는 기술

• 모바일과 데스크톱으로 서비스 화면이 여러 개로 나눠져있을때 BFF에 GraphQL을 검토해보는것이 좋음
• 모바일과 데스크톱의 경우 UI 구성이 다르기 때문에 GraphQL을 제공한다면 서버에서는 API를 모바일과 데스크톱에 따라 다르게 제공하지 않아도 됨
• 유지보수성이 더 좋아짐

BFF와 마이크로 서비스 간 호출 구조

• BFF는 여러 API를 통해 데이터를 빨리 가져오기 위해 non-blocking & 비동기 패턴을 적용해야함.
• 카카오페이는 WebFlux,코루틴 도입