11키티즈 게임에서 XState를 선택한 이유 11키티즈 게임에서는 주요 비즈니스 로직 구현을 위하여 XState를 선택했다. 일반적인 프론트엔드 개발에서는 React의 useState, Redux, Zustand 등을 사용하여 상태를 관리하지만, 게임이라는 특수한 환경에서는 상태 전환의 명확성과 개발 생산성 및 품질 관리가 중요하다고 판단했기 때문이다. 이 글에서는 왜 웹 어플리케이션 게임 개발에서 XState가 효과적인지, 크게 두 가지 측면에서 그 이유를 설명하고자 한다. 1. 개발 생산성과 품질: 유한 상태 머신의 명확성 React는 본질적으로 ‘무한 상태 머신(Infinite State Machine)’이다. 즉, 상태가 조건이나 사용자 입력에 따라 자유롭게 변화하며, 무한한 상태 조합이 발생할 수 있다는 의미다. 이로 인해 복잡한 상태 전환 로직을 관리하기 어렵고, 상태 간의 의존성이 얽히기 쉬워져 버그 발생 가능성 또한 높아진다. 반면, XState는 ‘유한 상태 머신(Finite State Machine)’을 기반으로 한다. 유한 상태 머신은 정해진 상태와 명확한 전환 규칙을 선언적으로 정의하여 상태를 엄격히 제한한다. 각 상태에서 허용되는 전환을 명확히 명시하고, 각 상태의 동작을 완벽히 격리하여 관리할 수 있다. 이로써 코드 유지보수가 용이하고 예기치 못한 오류 가능성을 줄일 수 있다. 일반적으로 게임은 매우 많은 상태의 조합을 통해 게임 화면과 동작을 구현한다. 예를 들어 플레이어 캐릭터가 ‘대기’, ‘이동’, ‘공격’, ‘방어’ 등 명확한 상태를 가질 때, XState는 각 상태에서 허용 가능한 전환만을 명시적으로 정의하도록 한다. 이는 정의되지 않은 상태 전환을 원천적으로 방지하여 예기치 않은 버그나 오작동의 위험을 크게 줄인다. 이번 프로젝트인... ||

