2026년 웹 게임 엔진: PlayCanvas vs Three.js vs Babylon.js vs Unity WebGL
글 Oleg Sidorkin, Cinevva CTO 겸 공동창업자
2026년에 브라우저에서 돌아가는 3D 게임을 출시하고 싶다면, 주류 선택지 네 가지와 더 새로운 것 몇 가지가 있습니다. 흔히 "웹 게임 엔진"으로 한데 묶이지만, 사실은 서로 다른 문제를 푸는 진짜로 다른 도구들입니다. 잘못 고르면 몇 달을 날립니다. 이 글은 최신 정보로 사실 확인을 거친 비교이며, 웹 3D 엔진을 만드는 일을 직업으로 삼고 직접 엔진을 만들기 전에 이 모든 것을 평가한 사람들이 썼습니다.
각 선택지가 실제로 무엇인지, 누구를 위한 것인지, 어디서 무너지는지를 살펴본 다음, 마지막에 짧은 결정 가이드를 드리겠습니다. 버전 번호를 언급하는 곳은 2026년 6월 기준으로 정확합니다.
빠른 비교
| PlayCanvas | Three.js | Babylon.js | Unity WebGL | Cinevva | |
|---|---|---|---|---|---|
| 무엇인가 | 완전한 엔진 + 호스팅 에디터 | 렌더링 라이브러리 | 완전한 엔진 + 에디터 | 데스크톱 엔진, 웹 내보내기 | AI 네이티브 월드 플랫폼 |
| 아키텍처 | 엔티티-컴포넌트(ECS) | 씬 그래프 | 씬 그래프 + 컴포넌트 | GameObject/컴포넌트 | 씬 그래프 + AI 빌더 |
| 스크립팅 | TypeScript / JavaScript | JavaScript(나머지는 직접 구축) | TypeScript / JavaScript | C#(Wasm으로 컴파일) | 자연어 + 코드 |
| 렌더러 | WebGL2, WebGPU 성숙 중 | WebGL2, WebGPU 성장 중 | WebGL2, WebGPU 발전 중 | WebGL2(내보내기) | WebGPU 전용 |
| 에디터 | 호스팅형, 상용 | 없음 | 웹 기반, 무료 | 데스크톱, 상용 | 월드 내, 몰입형 |
| 물리 | Ammo / 통합 | 직접 준비 | Havok 내장 | 내장(PhysX) | 커스텀 캐릭터 솔버 |
| 라이선스 | 엔진 MIT, 에디터 독점 | MIT | MIT | 독점 | 독점 |
| 적합한 곳 | 스튜디오형 브라우저 게임 | 커스텀 3D, 완전한 제어 | 다 갖춰진 게임 | 기존 Unity 게임 이식 | 월드 내 AI 게임 제작 |
이 글의 나머지는 이 표를 설명합니다.
PlayCanvas
PlayCanvas는 웹에서 Unity 스타일 워크플로에 가장 가까운 물건입니다. 엔진은 MIT 라이선스의 오픈소스이며, 2026년 6월 5일 기준으로 v2.19.6입니다. 엔티티-컴포넌트 시스템을 쓰고, 게임 로직은 TypeScript나 JavaScript로 작성하며, 에셋은 GLB를 만들어 내는 서버 사이드 파이프라인을 거칩니다. 실제 상용 게임들이 이 위에서 돌아가고, 큰 회사들이 프로덕션에서 씁니다. Snap이 공개된 예입니다.
PlayCanvas에 대해 사람들이 흔히 잘못 아는 두 가지를 바로잡을 만합니다. 첫째, 엔진은 MIT 라이선스지만, 대부분의 팀이 실제로 쓰는 호스팅 비주얼 에디터는 오픈소스가 아니라 상용 제품입니다. 에디터 없이 엔진만 자유롭게 쓸 수 있지만, 에디터와 클라우드를 묶은 워크플로가 유료 부분입니다. 둘째, PlayCanvas는 WebGL2 우선입니다. WebGPU 경로가 있긴 하지만 기본 렌더러라기보다 아직 성숙해 가는 중이므로, 프로덕션용 WebGPU 컴퓨트 셰이더를 기대하고 오늘 PlayCanvas를 고르지는 마세요.
PlayCanvas가 진짜로 앞서는 곳은 3D 가우시안 스플래팅입니다. 팀이 오픈소스로 공개한 SuperSplat 에디터와 뷰어는 웹에서 스플랫 씬을 캡처하고 출시하는 데 있어 어디 내놔도 손꼽히는 도구이며, 대용량 캡처를 위한 WebGPU 기반 스트리밍을 갖췄습니다. 포토리얼하게 스캔한 환경이 목표라면, 여기서 시작할 진짜 이유가 됩니다.
PlayCanvas를 고르세요 브라우저용으로 Unity 같은 에디터와 관리형 에셋 파이프라인을 원하고, 스튜디오가 만들 법한 게임을 출시하려 한다면. 다른 곳을 보세요 오늘 당장 WebGPU 컴퓨트가 필요하거나, 호스팅형 상용 에디터를 피하고 싶다면.
Three.js
Three.js는 게임 엔진이 아닙니다. 렌더링 라이브러리이며, 이 분야에서 압도적인 차이로 가장 널리 쓰입니다. 씬 그래프, 카메라, 라이트, 머티리얼, 지오메트리, 로더, 렌더러를 주고 나서 거기서 멈춥니다. 에디터도, 물리도, 엔티티 시스템도 없고, 게임을 어떻게 구성해야 하는지에 대한 의견도 없습니다. 그건 직접 더하거나 생태계에서 끌어와야 합니다.
그 맞바꿈이 이야기의 전부입니다. 최대한의 제어와 웹 3D에서 가장 큰 커뮤니티를 얻는 대신, 렌더러 위의 모든 것을 직접 만들거나 조립해야 합니다. WebGPU 렌더러는 꾸준히 성장해 왔고 오늘날 쓸 만하지만, 다른 것들과 마찬가지로 WebGL2 경로가 여전히 성숙한 기본값입니다. Three.js는 MIT 라이선스입니다.
Three.js를 고르세요 완전한 제어와 최소한의 기반을 원하고, 그 위에 게임 시스템을 직접 구축할 엔지니어링 역량이 있다면. 다른 곳을 보세요 에디터와 게임 시스템을 손에 쥐여주길 원한다면.
Babylon.js
Babylon.js는 완전한 엔진으로, MIT 라이선스이며 Microsoft의 팀이 뒷받침합니다. Three.js와 달리, 직접 조립해야 할 부품들을 함께 제공합니다. 컴포넌트 모델, 통합된 Havok 물리 엔진, 무료 웹 기반 에디터, 에셋 파이프라인이 그것입니다. WebGPU 작업이 빠르게 진행돼 범용 엔진들 중에서도 더 앞선 축에 들지만, 여전히 넓은 호환성 경로로 WebGL2를 유지합니다.
"완전한 엔진과 포함된 물리를 원하고, 그 규약 안에서 작업하는 게 편하다"가 머릿속 그림이라면, Babylon은 강력한 기본 선택지이며 이 분야에서 가장 기능이 완비된 무료 옵션이라고 볼 만합니다.
Babylon.js를 고르세요 배터리가 포함된 것, 내장 물리, 무료 에디터를 원한다면. 다른 곳을 보세요 의존성 부담을 최소화하고 싶거나, 구체적으로 Unity 스타일 호스팅 워크플로를 원한다면.
Unity WebGL
Unity WebGL은 웹 엔진이 아닙니다. 내보내기 대상입니다. Unity 데스크톱 에디터에서 C#으로 빌드한 다음, WebAssembly를 통해 브라우저에서 돌아가는 WebGL 번들로 컴파일합니다. 그래서 한 가지 특정 경우에는 분명한 답이 됩니다. 이미 Unity 게임이 있고 그것의 브라우저 버전을 원할 때입니다.
웹 우선 프로젝트에는 진짜 비용이 따릅니다. 런타임과 다운로드 무게가 상당하고, 시작이 네이티브 웹 엔진보다 느리며, 모바일 브라우저 성능은 알려진 골칫거리입니다. Unity는 독점이고 그 WebGL 출력은 WebGL2를 대상으로 합니다.
Unity WebGL을 고르세요 브라우저로 가져올 기존 Unity 프로젝트가 있거나, 팀이 이미 Unity 안에서 산다면. 다른 곳을 보세요 중급 휴대폰에서의 즉시 로드가 양보 불가한 요구사항이거나, 처음부터 웹 우선으로 새로 시작한다면.
AI 네이티브와 월드 내 제작이 들어맞는 자리
위의 모든 것은 한 가지 가정을 공유합니다. 개발자가 책상에서, 에디터 안에서 게임을 만들고 런타임을 출시한다는 가정입니다. 그 가정은 대부분의 프로젝트에 맞고, 당신 프로젝트가 그렇다면 위의 넷 중에서 고르세요.
다만 그 가정이 더는 유일한 선택지가 아니라는 걸 알아둘 만합니다. 다른 범주가 떠오르고 있기 때문입니다. 우리는 Cinevva를 만듭니다. 게임이 월드 안에서 만들어지는 WebGPU 전용 월드 플랫폼입니다. 에디터를 여는 대신, 당신은 그 공간에 서 있는 아바타이고, 원하는 것을 말로 설명하면 AI 빌더가 당신이 거기 서 있는 동안 그것을 지형, 오브젝트, 동작으로 바꿔 줍니다. 제작과 플레이가 같은 세션입니다. 그 이면에서 이것은 컴퓨트 셰이더 지형으로 WebGPU 전용으로 가고, 범용 물리 엔진 대신 커스텀 캐릭터 솔버를 작성하고, 애니메이션과 리타게팅 시스템을 만든다는 뜻이었습니다. 이에 대해서는 우리가 직접 WebGPU 엔진을 만든 이유에 적어 두었습니다.
이것은 PlayCanvas나 Babylon을 대체하는 게 아닙니다. 특정 게임을 만드는 개발자라면 그것들이 맞는 도구입니다. Cinevva는 엔진 개발자가 아닌 사람들이 설명만으로 플레이 가능한 공간을 만들고 공유하게 한다는 다른 목표를 위한 것입니다. 여기서 언급하는 이유는 "어떤 웹 게임 엔진을 써야 하나"라는 질문에 점점 더 엔진이 아닌 다섯 번째 답이 생기고 있기 때문입니다.
전체 기능 매트릭스
맨 위의 빠른 표가 헤드라인입니다. 이건 서브시스템별로 묶은 상세 버전입니다. 읽는 법에 대한 솔직한 메모 몇 가지를 드립니다. "BYO"는 직접 준비(bring your own)를 뜻하는데, 엔진이 기본으로 제공하지 않지만 생태계나 직접 작성한 코드로 더할 수 있다는 말입니다. 이건 설계상 렌더링 라이브러리인 Three.js에서 가장 중요하므로, 여기서 "BYO"는 빈틈이 아니라 철학의 특징입니다. Unity의 "내보내기 전용(Export-only)"은 그 기능이 데스크톱 에디터에 존재하고 WebGL 빌드에 함께 따라온다는 뜻이지 웹 네이티브라는 뜻이 아닙니다. 경쟁 제품 칸은 2026년 중반 기준 기본 제공 기능과 잘 문서화된 동작을 반영합니다. Cinevva 칸은 우리가 출시한 빌드에서 돌아가는 것을 반영하며, "계획됨(planned)"은 설계됐지만 아직 구축되지 않은 것을 표시합니다.
렌더링
| 기능 | Cinevva | PlayCanvas | Three.js | Babylon.js | Unity WebGL |
|---|---|---|---|---|---|
| 주 렌더러 | WebGPU 전용 | WebGL2 (WebGPU 베타) | WebGL2 (WebGPU 성장 중) | WebGL2 (WebGPU 발전) | WebGL2 (내보내기) |
| 프로덕션 컴퓨트 셰이더 | 예 (핵심 의존성) | 베타 | WebGPU 경유 | 예 (WebGPU) | 내보내기 전용, 제한적 |
| 셰이더 작성 | TSL 노드 + 컴퓨트 | 셰이더 청크 / GLSL | GLSL + 노드(TSL) | 노드 머티리얼 / GLSL / WGSL | ShaderLab / HLSL |
| 클러스터드 / forward+ 조명 | 예 (froxel) | 예 | BYO | 예 | 예 |
| 볼류메트릭 구름과 날씨 | 예 | BYO | BYO | 일부 | BYO |
| 3D 가우시안 스플래팅 도구 | 계획됨 | 예 (SuperSplat, 선도) | 커뮤니티 | 예 | 플러그인 |
월드와 지형
| 기능 | Cinevva | PlayCanvas | Three.js | Babylon.js | Unity WebGL |
|---|---|---|---|---|---|
| 내장 대규모 월드 스트리밍 | 예 (64m 청크) | BYO | BYO | BYO | 내보내기 전용 |
| 지형 시스템 | 하이브리드 하이트맵 + 마칭 큐브/SDF | BYO | BYO | 확장 | 내장 (데스크톱) |
| 런타임 지형 스컬핑 | 예 (GPU) | BYO | BYO | BYO | 아니오 (편집 시점) |
| 동굴과 오버행 (진짜 3D 토폴로지) | 예 (마칭 큐브) | BYO | BYO | BYO | BYO |
| GPU 인스턴싱 초목과 풀 | 예 | 예 | BYO | 예 | 예 |
물리와 캐릭터
| 기능 | Cinevva | PlayCanvas | Three.js | Babylon.js | Unity WebGL |
|---|---|---|---|---|---|
| 물리 엔진 | 커스텀 키네마틱 솔버 | Ammo 통합 | BYO (Rapier/Cannon/Ammo) | Havok 내장 | PhysX 내장 |
| 강체 동역학 | 아니오 (설계상) | 예 | BYO | 예 | 예 |
| 캐릭터 컨트롤러 | 예 (멀티 모드 FSM) | 템플릿 / Ammo | BYO | 예 | 내장 |
| 지형 통합 충돌 (SDF) | 예 | 아니오 | BYO | 아니오 | 아니오 |
애니메이션
| 기능 | Cinevva | PlayCanvas | Three.js | Babylon.js | Unity WebGL |
|---|---|---|---|---|---|
| 스켈레탈 애니메이션 | 예 | 예 | 예 | 예 | 예 |
| 블렌드 / 상태 머신 | 예 (리졸버 FSM) | 예 (애니 상태 그래프) | 믹서 (BYO 블렌딩) | 예 | 예 (Mecanim) |
| 스켈레톤 리타게팅 | 예 (파이프라인) | 제한적 | 커뮤니티 | 일부 | 예 (휴머노이드) |
| 역운동학 | 계획됨 | 제한적 | 커뮤니티 | 예 | 예 |
멀티플레이어와 백엔드
| 기능 | Cinevva | PlayCanvas | Three.js | Babylon.js | Unity WebGL |
|---|---|---|---|---|---|
| 내장 멀티플레이어 | 예 (엣지 권위형) | BYO (Photon/Colyseus) | BYO | BYO | BYO (Netcode, 웹 네이티브 아님) |
| 영속 공유 월드 | 예 (청크별 Durable Objects) | BYO | BYO | BYO | BYO |
| 공간 음성 채팅 | 예 (WebRTC + HRTF) | BYO | BYO | BYO | BYO |
제작과 저작
| 기능 | Cinevva | PlayCanvas | Three.js | Babylon.js | Unity WebGL |
|---|---|---|---|---|---|
| 에디터 | 월드 내, 몰입형 | 호스팅 데스크톱형 (상용) | 없음 (최소) | 웹 기반 (무료) | 데스크톱 (상용) |
| 월드 내 체화형 제작 | 예 | 아니오 | 아니오 | 아니오 | 아니오 |
| 자연어 / AI 제작 | 예 (AI 빌더) | 아니오 | 아니오 | 아니오 | 아니오 |
| 스크립팅 | 자연어 + JS | TypeScript / JS | JavaScript | TypeScript / JS | C# |
에셋과 배포
| 기능 | Cinevva | PlayCanvas | Three.js | Babylon.js | Unity WebGL |
|---|---|---|---|---|---|
| 서버 사이드 에셋 파이프라인 | 예 (GLB + LOD + KTX2 + Draco) | 예 (GLB) | 로더만 | 임포트 도구 | 예 |
| 내장 AI 에셋 생성 | 예 (3D, 이미지, 오디오, 음악) | 아니오 | 아니오 | 아니오 | 아니오 |
| 페더레이티드 에셋 검색 | 예 (11개 제공자) | 에셋 스토어 | 아니오 | 아니오 | 에셋 스토어 |
| 설치 없이 브라우저에서 실행 | 예 | 예 | 예 | 예 | 예 (무거움) |
| 엔진 라이선스 | 독점 플랫폼 | 엔진 MIT, 에디터 독점 | MIT | MIT | 독점 |
매트릭스의 패턴이 진짜 이야기입니다. 범용 엔진들은 강점을 수평으로 펼칩니다. 각자 대부분의 일을 능숙하게 해내고, 월드와 백엔드와 제작 흐름은 당신에게 맡깁니다. Cinevva는 수직으로 집중합니다. 더 적은 일을 하지만 렌더러에서부터 당신이 안에서 만드는 공유 월드까지 전 경로를 소유합니다. 추상적으로는 어느 모양이 더 낫지 않습니다. 서로 다른 질문에 답할 뿐입니다.
어떻게 고를까
기능 체크리스트가 아니라 상황에 도구를 맞추세요.
이미 Unity 게임이 있다면, Unity WebGL로 내보내고 무게를 감수하세요. 브라우저 게임에 에디터 주도 워크플로를 원하는 스튜디오라면, PlayCanvas를 쓰세요. 물리가 포함된 완전한 무료 엔진을 원한다면, Babylon.js를 쓰세요. 완전한 제어를 원하고 맨 렌더러 위에 구축할 팀이 있다면, Three.js를 쓰세요. 그리고 목표가 게임 하나를 만드는 게 아니라 사람들이 설명만으로 공유 월드 안에서 만들고 플레이하게 하는 것이라면, 그게 우리가 일하는 범주이고, Cinevva를 써 보세요.
무엇을 고르든, 커밋하기 전에 진짜 스파이크로 평가하세요. 이 각각은 진짜 게임을 떠받칠 수 있고, 중간에 갈아타는 비용은 출시에 쓰지 못한 그 몇 달입니다.