Excalibur.js

Excalibur.js 또는 Excalibur는 TypeScript로 개발된 자유·오픈 소스 2차원 게임 엔진이다. 웹 브라우저에서 실행되는 게임을 쉽게 제작할 수 있도록 장면과 게임 객체, 렌더링·충돌·입력·오디오 등 공통 시스템을 통합한다. JavaScript와 TypeScript...

분류게임 엔진, 웹 기반 2D 게임 엔진
개발 주체Excalibur.js 오픈 소스 프로젝트
작성 언어TypeScript
사용 언어TypeScript, JavaScript
실행 환경웹 브라우저, HTML5
렌더링WebGL 기본, Canvas 2D 대체 구현
핵심 객체Engine, Scene, Actor, Entity
주요 기능2D 그래픽스, 충돌·물리, 애니메이션, 입력·오디오
장면 구성장면 그래프와 Actor·자식 객체
개발 도구Excalibur CLI, 브라우저 디버거 확장
프로젝트 도구npm, Vite 등 프런트엔드 빌드 도구
주요 배포 방식웹사이트·웹 게임 번들
추가 패키징Electron 등 웹 기반 패키저 연동
공개 라이선스BSD 2-Clause
공식 웹사이트excaliburjs.com
소스 코드excaliburjs/Excalibur

Excalibur.js 또는 Excalibur는 TypeScript로 개발된 자유·오픈 소스 2차원 게임 엔진이다. 웹 브라우저에서 실행되는 게임을 쉽게 제작할 수 있도록 장면과 게임 객체, 렌더링·충돌·입력·오디오 등 공통 시스템을 통합한다. JavaScript와 TypeScript 프로젝트에 라이브러리로 추가하여 사용할 수 있으며, 시각적 편집기보다 프로그래밍 코드와 웹 제작 도구를 중심으로 하는 개발 환경을 제공한다.[1]

Excalibur의 기본 실행 객체는 Engine이다. 개발자는 화면 크기와 표시 방식, 입력 동작 등의 옵션을 설정한 뒤 엔진을 실행하고 하나 이상의 장면(Scene)을 구성한다. 장면에는 여러 액터(Actor)와 기타 엔티티(Entity)를 넣을 수 있으며, 액터가 자식 객체를 갖는 계층 구조로 화면 속 대상을 조직한다. 활성 장면만 기본 갱신·렌더링 대상이 되는 구조를 이용해 타이틀 화면과 스테이지 등을 분리할 수 있다.

실행 루프는 게임 상태를 갱신하는 단계와 화면에 표시할 내용을 그리는 단계로 나뉜다. 액터와 장면에는 갱신 및 그리기 시점에 호출되는 생명 주기 메서드가 제공되며, 개발자는 이를 이용해 이동·애니메이션·게임 규칙을 구현한다. 갱신과 렌더링을 구분하면 게임 로직이 직접 그래픽스 API를 조작하는 방식보다 구조를 관리하기 쉬워진다. 엔진은 액터와 장면, 이벤트와 구성 요소를 게임 제작에 적합한 고수준 API로 묶는다.[2]

렌더링에는 HTML5 Canvas 요소가 사용되지만 최신 Excalibur의 기본 그래픽스 구현은 WebGL을 이용하며, 지원 환경에 따라 Canvas 2D로 대체할 수 있다. 그래픽 객체는 이미지, 스프라이트, 도형과 사용자 정의 표시 내용 등을 추상화하고 렌더링 호출을 묶어 처리한다. Canvas 2D 대체 경로는 사용자 정의 렌더러와 일부 후처리 기능을 제공하지 않으므로 기본 WebGL 경로와 기능이 항상 일치하는 것은 아니다.[3]

Excalibur에는 게임 객체 충돌과 간단한 물리 시뮬레이션, 입력 이벤트 및 리소스 관리 기능이 포함된다. 개발자는 이미지와 사운드를 로드하고 액터의 좌표·크기·시각적 상태를 변경하며, 충돌 이벤트에 따라 게임 규칙을 처리한다. CLI를 이용하면 npm init excalibur@latest로 프로젝트 템플릿을 만들 수 있고, 기존 프로젝트에도 npm 패키지나 브라우저용 모듈로 추가할 수 있다. 공식 도구에는 일부 브라우저용 디버깅 확장도 포함된다.[4]

Excalibur.js는 BSD 2-Clause 라이선스로 공개되며 상용 게임에도 이용할 수 있다. 소스와 템플릿은 GitHub에 보관되며 사용자가 직접 브라우저에서 실행할 게임을 제작하고 배포할 수 있다. 같은 웹 기반 2D 게임 엔진인 Eva.js와 비교하면, Eva.js가 ECS와 렌더링 플러그인의 조립을 강조하는 데 비해 Excalibur는 장면·Actor와 내장 게임 시스템을 포함하는 통합형 API를 중심으로 한다. 브라우저 기술 발전에 따라 렌더링 및 패키징 지원 범위도 계속 변화한다.[5]

역사

개발 목적과 기술적 배경

엔진 아키텍처

실행 모델과 게임 객체

개발 언어와 스크립팅

렌더링과 그래픽스

물리·입력·오디오

자산 형식과 데이터 처리

제작 도구와 디버깅

지원 플랫폼과 배포

라이선스와 소스 공개

게임 제작과 활용 사례

기술적 영향

관련 문서

  1. Excalibur.js 공식 소개 ↩
  2. Excalibur.js 실행 모델 문서 ↩
  3. Excalibur.js 그래픽스 컨텍스트 ↩
  4. Excalibur.js 빠른 시작 ↩
  5. Excalibur.js 공식 저장소 및 라이선스 ↩