고전 3D 슈팅 게임 퀘이크(Quake)가 웹 브라우저에서 CSS(Cascading Style Sheets)만으로 렌더링되는 'CSSQuake' 데모가 공개되어 웹 개발 커뮤니티의 뜨거운 관심을 받고 있습니다. 'PolyCSS renderer v0.2.6'을 핵심 기술로 사용하며, 현재 'cssQuake v0.230' 버전으로 초기화 및 'coming soon!' 상태를 보여주고 있습니다. 이 데모는 퀘이크 셰어웨어 버전 1.06을 포함하고 있으며, 멀티플레이어 설정과 조작 안내, 디버그 토글 등 다양한 기능을 함께 제공하여 브라우저에서 퀘이크를 직접 플레이해 볼 수 있는 기회를 제공합니다.
CSSQuake는 단순히 CSS로만 게임을 구현한 것이 아니라, 게임 로직은 타입스크립트(TypeScript)로 작성되었습니다. 원본 퀘이크의 QuakeC/progs.dat 파일에서 상태, 모델, 공격, 소리 등의 정보를 JSON 형태로 추출한 후, 이를 타입스크립트 런타임이 활용하여 퀘이크와 유사한 플레이 경험을 구현하는 방식입니다. 현재 E1M1 'the Slipgate Complex'를 포함한 8개의 맵을 지원하며, WASD 이동, 마우스 시점 전환, 클릭 발사 등 원작과 동일한 조작 방식을 제공합니다. 일부 사용자들은 구형 PC에서보다 M1 Pro 맥에서 버벅임을 경험했다고 언급했지만, M2 크롬(Chrome)이나 파이어폭스(Firefox) 환경에서는 부드럽게 작동한다는 피드백도 있어 브라우저 및 기기별 성능 차이가 존재합니다.
CSSQuake는 웹 표준 기술인 CSS와 자바스크립트(JavaScript) 기반의 타입스크립트만으로 복잡한 3D 게임을 구현했다는 점에서 웹 기술의 잠재력과 확장성을 보여주는 중요한 사례입니다. 이는 웹 브라우저가 단순한 정보 소비를 넘어 고성능 애플리케이션 플랫폼으로 진화할 수 있음을 시사하며, 웹 기반 게임 개발자들에게 새로운 영감을 제공할 수 있습니다. 또한, CSS의 한계를 뛰어넘는 창의적인 활용법을 제시함으로써 웹 개발자들이 기존 기술을 새로운 방식으로 탐구하고 실험하도록 독려하는 계기가 될 것입니다. 이 프로젝트는 웹 기술이 어디까지 발전할 수 있는지에 대한 질문을 던지며, 앞으로 웹 기반 인터랙티브 콘텐츠의 가능성을 더욱 확장할 것으로 기대됩니다.