피드로 돌아가기
Dev.toInfrastructure
원문 읽기
AliScript 개발 및 Dual-State 설계를 통한 60fps 실시간 시뮬레이터 구현
How I Built a Real-Time Robot Battle Simulator from Scratch — Logic Arena
AI 요약
Context
알고리즘 경쟁 기반의 로봇 배틀 시뮬레이터 구축 과정에서 발생한 상태 동기화 및 렌더링 병목 현상을 해결함. 초기 설계의 Singleton 패턴 부재와 Main Thread의 과부하로 인해 15fps 수준의 낮은 성능을 기록한 상황.
Technical Solution
- @Global() 데코레이터를 통한 NestJS 서비스 싱글톤 강제로 전체 모듈 간 게임 엔진 상태 동기화 달성
- String $\rightarrow$ Lexer $\rightarrow$ Parser $\rightarrow$ AST $\rightarrow$ Evaluator 파이프라인 기반의 자체 DSL인 AliScript 설계로 알고리즘 제어 로직 추상화
- 연산자 우선순위 해결을 위해 parseBinaryExpression을 parseAddition과 parseMultiply로 분리한 계층적 파싱 구조 도입
- useRef 기반의 게임 로직 처리와 10fps로 제한된 useState UI 업데이트를 분리한 Dual-State 아키텍처 설계로 렌더링 부하 제거
- THREE.InstancedMesh 도입 및 Fragment Shader로 애니메이션 연산을 GPU로 이관하여 WebGL Draw Call 최소화
- Ring Buffer 도입을 통한 리플레이 스냅샷 메모리 누수 차단 및 클라이언트 연결 종료 시 엔진 정지를 통한 CPU 자원 낭비 방지
실천 포인트
- 실시간 렌더링 구현 시 logic state(ref)와 view state(state)를 분리하여 불필요한 Re-render 방지 - 다수의 동일 객체 렌더링 시 Instanced Mesh 및 GPU-based Animation 적용 검토 - Docker 이미지 빌드 시 .dockerignore 설정을 통한 Build Context 최적화 여부 확인 - 자체 DSL 설계 시 추상 구문 트리(AST) 기반의 재귀적 탐색 구조 적용 고려