AI한테 프레임워크별로 웹 개발 시켰을 때 드는 실제 비용 비교.txt

요약 웹 개발 생태계에서는 어떤 프레임워크가 '더 빠르다'거나 'AI 에이전트 개발에 더 유리하다'는 주장이 흔히 객관적인 벤치마크 없이 개발자들의 직관이나 느낌(Vibes)에 의존해 퍼지곤 합니다. 저자는 이러한 '느낌 위주의 결정'에 의문을 품고, 실제로 AI 에이전트(Claude Opus 5.5)에게 동일한 포켓몬 도감 웹 애플리케이션 개발을 지시한 뒤 프레임워크별 비용과 성능을 비교하는 벤치마크를 진행했습니다. 테스트 대상 앱은 PokéAPI를 활용해 포켓몬 목록 조회, 타입 및 기술 정보 검색, 필터링 기능을 갖춘 사이트로 구현되었습니다. 공정한 비교를 위해 각 프레임워크의 공식 MCP(Model Context Protocol) 또는 전용 스킬을 적용했으며, 별도의 CSS 컴포넌트 라이브러리(Tailwind, Bootstrap 등)는 배제하고 접근성 트리 기반의 테스트 스위트로 적합성을 검증했습니다. LLM의 무작위성(stochasticity)과 라이트하우스 측정 편차를 감안해 각 프레임워크당 5회씩(오류가 잦았던 Angular는 3회) 반복 실행하여 중간값을 산출했습니다. Claude Code API 비용 기준으로 빌드 비용을 분석한 결과, Hono+htmx가 1회당 중간값 2.67달러로 가장 저렴하게 앱을 완성했습니다. 그 뒤를 이어 Astro(2.76달러), Nuxt(2.82달러), 바닐라 자바스크립트(2.98달러), Next.js(3.14달러) 순으로 낮은 비용을 기록했습니다. 반면 SvelteKit(4.28달러), Gracile+Lit(4.65달러), Angular(4.97달러) 등은 상대적으로 높은 토큰 비용이 발생했습니다. 특히 Angular는 두 차례나 제대로 작동하는 앱을 빌드하지 못해 실패를 겪기도 했습니다. 저자는 프레임워크별로 편차가 존재하지만, 최신 프레임워크라 해서 무조건 AI 개발 비용이 적게 드는 것은 아니라는 점을 실제 수치로 보여주었습니다.