김재현Hammer Turtle
프로젝트 목록

NeoEvent Web SDK

게임 홈 및 웹숍 배너 클릭 트래킹을 위한 브라우저용 통합 Web SDK 구축

배경 및 목표

① 웹상점 활성화 및 트래킹 필요성: 웹상점 활성화 작업의 일환으로 게임홈 내 주요 PC 배너 구좌(이벤트 배너, 윙배너, 추천상품 배너)별 정밀한 클릭 트래킹 및 통계 대시보드 연동을 기획함.

② 웹 전용 인프라 공백: 기존 사내 데이터 수집 인프라는 Unity C# 기반 SDK만 존재할 뿐, PC 브라우저 및 웹뷰 환경을 위한 전용 Web SDK가 전무하여 실시간 웹 트래킹 적용이 불가능한 상태였음.

→ 사내 공통 라이브러리로 활용 가능한 브라우저 전용 SDK를 Unity C# 기반에서 포팅하고, 무중단 유통을 위한 CDN 배포 파이프라인(AWS S3 + CloudFront)을 구축하고자 함.

역할

시스템 구조 설계 참여 및 주도적 개발

주요 업무 및 성과

① Unity C# SDK의 TypeScript 포팅 및 모던 번들링 아키텍처 수립

  • C#에서 TypeScript로의 포팅: 기존 Unity C# 이벤트 수집 SDK의 고유 데이터 규격과 생명주기 제어 로직을 TypeScript 환경으로 완벽하게 포팅하여 브라우저 독립형 Web SDK 규격을 정립.
  • tsup 기반 범용 멀티 포맷 번들링 구축: 사내 개발팀의 다양한 웹 프론트엔드 통합 환경을 지원하기 위해 tsup 컴파일러 도입. 모던 프레임워크용 NPM 패키지(ESM/CJS)뿐만 아니라, 레거시 정적 페이지 및 웹뷰를 위한 IIFE 글로벌 스크립트 번들까지 단일 코드 베이스로 유연하게 빌드하도록 다각화.

② 브라우저 환경 최적화

  • 가용성 중심의 전송 메커니즘 설계: 네트워크 단절 또는 불안정 상태에서 로그 유실을 방지하기 위해 localStorage 기반의 오프라인 큐잉(Caching) 아키텍처 이식.
  • 브라우저 생명주기 밀착 동기화: 사용자가 페이지를 이탈하거나 백그라운드로 전환하는 시점을 추적하기 위해 브라우저 고유 이벤트를 가로채어 시스템 상태 플로우(start → pause → resume → quit)와 맵핑.

③ S3 + CloudFront 기반 CDN 배포 자동화

  • 빌드된 번들 파일을 AWS S3에 동적으로 업로드하고 신규 버전을 유통하는 지속적 배포(CD) 파이프라인 완비.

결과

① 현재 개발한 SDK를 이용하여 웹샵에 적용하는 개발 중.

회고

이번 프로젝트는 사내에 파편화되어 있던 데이터 수집 인프라의 공백을 메우기 위해, 유니티 플랫폼의 명세를 웹 생태계(TypeScript)에 맞게 포팅하는 라이브러리 빌딩 경험을 했다.

어려웠던 점

개발 과정에서 브라우저라는 특수한 환경으로 인해 유저가 탭을 닫거나 네트워크가 단절되는 등의 이벤트 유실 리스크를 해결해야 하는 어려움이 있었다.

→ 이를 극복하기 위해 localStorage 큐잉 버퍼와 지수 백오프(Exponential Backoff) 알고리즘을 이식했으며, 브라우저가 종료되거나 탭이 닫히는 시점에도 백그라운드에서 남은 이벤트를 안전하게 전송할 수 있는 데이터 전송 파이프라인을 구축했다.