실시간 AI 채팅 및 게이미피케이션 서비스 '캣봇' 개발.

2025.09 - 현재 React, TypeScript, WebSocket API, Phaser.js, WebAudio API

저수준 WebSocket API 기반의 커스텀 실시간 통신 시스템 설계:
- 외부 라이브러리 없이 순수 WebSocket API를 사용하여 연결, 인증, 재연결 로직을 직접 구현하여 통신 오버헤드 최소화.
- 직접 구현한 핑퐁(Ping-pong) 메커니즘과 브라우저의 온라인/오프라인 이벤트 및 네트워크 상태 변경 감지를 통한 자동 재연결 로직으로 연결 안정성 확보.
LLM 및 오디오 스트리밍 연동 인터페이스 최적화:
- LLM 응답 이벤트(ACK/SUCCESS/ERROR)에 따른 단계별 세션 관리 및 예외 처리 로직을 구축하여 끊김 없는 실시간 대화 흐름 구현.
- AudioWorklet 및 AudioProcessor를 활용한 오디오 청크 단위 스트리밍 처리로 저지연(Low-latency) 음성 재생 및 실시간 텍스트 렌더링 구현.
- LLM 응답과 TTS 출력 간의 비동기 타이밍을 동기화하여 자연스러운 대화형 사용자 인터페이스(CUI) 구축.
Phaser.js를 활용한 웹 기반 교육 콘텐츠 엔진 구축:
- 고성능 Canvas 기반 게임 프레임워크를 도입하여 학습 몰입도를 높이는 인터랙티브 게임 콘텐츠 3종 개발.
- Scene 기반 상태 관리 및 리소스 프리로딩 최적화를 통해 웹 환경에서의 끊김 없는 사용자 인터랙션 구현.

하이브리드 교육 플랫폼 '캐츠홈' 및 '캐츠잉글리시' 런칭 및 고도화.

2024.03-2025.08 React, Next.js 14, TypeScript, Flutter, InAppWebView, Bridge Interface

App-Web 통신 인터페이스(JS Bridge) 표준화 및 모듈화:
- 웹과 앱 간의 비동기 통신 안정성을 위해 Promise 기반의 Bridge 통신 프로토콜을 설계하여 개발 생산성 30% 향상.
앱 라이프사이클 동기화를 통한 리소스 최적화:
- 앱이 백그라운드로 진입할 때 웹뷰 내 고부하 자원(setInterval, 애니메이션, 미디어 재생)을 즉시 중지하고, 포그라운드 복귀 시 복구하는 매니저 구현.
- 불필요한 메인 스레드 점유와 메모리 누수를 차단하여 저사양 단말기에서의 앱 강제 종료(ANR) 발생률 15% 개선.
저사양 전용 단말기(교육용 패드) 맞춤형 성능 최적화:
- 하위 호환성 및 저사양 CPU 환경을 고려하여 DOM 계층 단순화 및 CSS GPU 가속 최적화 적용.
- 페이지 로딩 속도 40% 개선 및 인터랙션 지연 시간(FID) 30% 단축.

2023.05-2024.02 React, TypeScript, JS Bridge

다중 웹뷰 환경에서의 비동기 통신 안정화 및 JS Bridge 고도화:
- 저사양 단말기에서의 화면 전환 성능 향상 및 점진적 마이그레이션을 위해 3개의 서브 도메인을 개별 웹뷰 인스턴스로 분리하여 운영.
- 다중 웹뷰 환경에서 postMessage 통신 시 메시지 순서 보장 불가 및 타이밍 이슈에 따른 데이터 유실 문제 해결.
- 해결책: HTTP의 Request-Response 구조를 모방하여 reqId/resId 기반의 메시지 매칭 시스템 구축.
  - 웹에서 고유 ID와 함께 요청 전송 시 Promise의 resolve 함수를 Map에 저장.
  - 앱에서 응답 수신 시 해당 ID를 대조하여 작업을 완료하는 구조로 통신 안정성 확보.
레거시 PC 웹사이트 현대화 및 빌드 최적화:
- Webpack 트리 쉐이킹 및 코드 스플리팅 적용으로 번들 사이즈 최적화 및 로딩 속도 50% 단축.

Untitled

2022.03.28 ~ 2023.03.31

Frontend Developer

2022.03 ~ 2023.02 (11개월) Typescript, zustand, React, emotion css, storybook

상태 관리 아키텍처 전환 (Redux → Zustand):
- 단일 스토어를 도메인별로 분리하여 상태 업데이트 범위를 최소화하고 실시간 호가 데이터 렌더링 성능 25% 개선.
Atomic Design 기반 Headless UI 디자인 시스템 구축:
- 비즈니스 로직과 UI를 분리한 Headless 컴포넌트 패턴 정의로 재사용성을 극대화하여 신규 기능 개발 속도 2배 향상.

2021.12 ~ 2022.03