핵심 요약
- 단 247바이트의 자바스크립트 코드만으로 8x8 보드와 연쇄 오픈 기능까지 갖춘 지뢰찾기가 구현되었습니다.
- 수년에 걸쳐 658바이트에서 399바이트를 거쳐 동료 개발자와의 협업으로 247바이트까지 코드를 극한으로 압축했습니다.
- 닫는 태그 생략, 인라인 함수 선언 등 브라우저 파서와 자바스크립트의 특성을 극한으로 쥐어짠 꼼수들이 활용되었습니다.
요약 웹 개발자 커뮤니티에서 단 247바이트(글자 수 247자)의 자바스크립트 코드로 브라우저에서 직접 돌아가는 지뢰찾기 게임을 구현해 화제를 모으고 있습니다.
이 미니멀 지뢰찾기는 무작위로 생성되는 8x8 보드를 갖추고 있으며, 좌클릭으로 칸 열기, 우클릭으로 깃발 표시 전환, 주변 지뢰가 0개인 빈 칸을 클릭했을 때 재귀적으로 연쇄 개방되는 기능, 그리고 기본적인 승리 판정까지 모두 갖추고 있습니다.
작성자에 따르면 몇 년 전 재미 삼아 코드 골프(가능한 가장 적은 코드로 기능을 구현하는 놀이)로 하룻밤 만에 658바이트 버전을 만들었고, 몇 주에 걸쳐 399바이트까지 줄인 뒤 한계에 부딪혀 작업을 접었습니다. 하지만 최근 드라이브를 정리하다가 발견한 뒤 블로그 글로 정리하려던 중 코드를 더 줄일 수 있는 기상천외한 방법들을 연달아 발견했습니다. 이후 디스코드 서버에서 다른 개발자(DNEK)와 합류해 수개월간의 시도 끝에 247바이트라는 극단적인 용량으로 압축하는 데 성공했습니다.
코드 최적화 트릭도 기상천외합니다. 닫는 태그(`</p>`, `</a>`)나 슬래시(`/`)를 아예 쓰지 않았는데, 브라우저 HTML 파서가 `<p>`나 `<a>` 태그 내부에 동일한 태그가 중복될 수 없다는 점을 이용해 다음 태그가 시작될 때 이전 태그를 자동으로 닫도록 유도했습니다. 또한 줄바꿈을 위해 별도 태그 대신 `<p>`를 활용하고 칸은 링크가 없는 `<a>`로 감쌌습니다. 조작 이벤트 역시 `onmouseup` 하나로 통합하고 `event.which`로 클릭 종류를 구분하도록 압축했습니다.
그 외에도 함수 호출문 인자 자리에서 다른 함수를 즉시 선언해 구분 기호(세미콜론 등)를 아끼거나, 함수의 매개변수 개수 제한을 무시하고 넘겨 바이트를 절약하는 등 자바스크립트와 HTML의 온갖 극한 꼼수와 문법 특성을 집약해 완성되었습니다.
Sponsored · 광고