이거 61KB짜리 HTML 파일임 🤯
This is 61 KB HTML file 🤯
핵심 요약
Claude Code를 활용해 30분 만에 제작한 고퀄리티 WebGPU 해양 시뮬레이션입니다.
- 해양 시뮬레이션 — WebGPU를 사용하여 61KB 단일 HTML 파일로 구현됨
- Claude Code 활용 — 별도의 엔진 없이 AI가 직접 렌더러를 작성함
- 자체 피드백 루프 — 하위 에이전트가 스크린샷을 분석해 결과물을 개선함
- 실시간 성능 — RTX 5070 Ti 기준 1440p 해상도에서 약 260 FPS 기록

Claude Code(Opus 5.5)로 실시간 바다 시뮬레이션 하나 만들어 봤다.
이게 뭐냐면: 61KB짜리 HTML 파일 하나로 브라우저에서 WebGPU를 돌려 노을 지는 바다를 구현한 거다. FFT 파도 시뮬레이션, 파도 거품, 물리 기반 구름과 하늘, 그리고 햇빛 반사까지 다 들어갔다. WASD랑 마우스로 돌아다닐 수 있음.
Claude Code 활용법: 프롬프트 딱 하나 던졌다. "WebGPU 써서 떠다니는 카메라가 있는, 가능한 한 제일 사실적인 바다 장면 만들어줘." 그랬더니 엔진이나 라이브러리 하나도 안 쓰고 렌더러를 밑바닥부터 다 짜더라. 심지어 지가 만든 결과물을 스크린샷 찍어서 다른 서브 에이전트한테 검수까지 시키더라고. 지가 한 걸 지가 평가하는 게 아니라서 더 정확함. 이거 다 하는 데 30분 정도 걸렸다.
무료 체험: 공짜다. 크롬에서 https://files.catbox.moe/17sdfi.html 열어봐라. WebGPU 지원하는 GPU가 필요하고, 노트북이면 크롬 설정에서 외장 그래픽 강제로 쓰게 바꿔야 한다. 안 그러면 성능 개판 날 수 있음(내 RTX 5070 Ti 기준 2560×1440 해상도에서 260 FPS 정도 나옴). 캔버스 클릭하면 시점 조절 가능하고, WASD로 이동, H 누르면 설정창 뜬다.


