랭킹웹
프레임워크별 AI 개발 비용 TOP 10
같은 앱을 Claude Code가 JS 프레임워크마다 5번씩 만든 비용의 중앙값입니다. 비용이 낮은 순서로 10개를 모았습니다.
- 1Hono+htmx범위 $2.23~$3.19, 8.6분$2.67공식 사이트
- 2Astro범위 $2.16~$3.63, 8.2분$2.76공식 사이트
- 3Nuxt범위 $2.39~$4.25, 9.0분$2.82공식 사이트
- 4Vanilla (Vite)범위 $2.24~$3.37, 10.1분$2.98공식 사이트
- 5Next.js범위 $2.58~$4.13, 10.9분$3.14공식 사이트
- 6Qwik범위 $2.35~$3.80, 10.7분$3.27공식 사이트
- 7TanStack Start범위 $3.11~$3.96, 10.3분$3.54공식 사이트
- 8SolidStart범위 $2.84~$4.81, 11.2분$3.79공식 사이트
- 9React Router범위 $2.82~$3.97, 12.5분$3.81공식 사이트
- 10SvelteKit범위 $3.59~$4.65, 10.8분$4.28공식 사이트
Nolan Lawson이 같은 포켓몬 앱을 프레임워크 12개로 5번씩 만들게 했습니다. 맡은 쪽은 Claude Code(Opus 5.5)입니다. 중앙값으로 가장 싼 쪽은 Hono+htmx($2.67)이고, Astro($2.76)와 Nuxt($2.82)가 뒤를 잇습니다. 10위 SvelteKit($4.28)은 1위의 약 1.6배입니다. 11위와 12위는 Gracile+Lit과 Angular인데, 표에는 상위 10개만 싣는 규칙이라 넣지 않았습니다. 수치는 원문에서 볼 수 있습니다.
순위 사이의 간격보다 한 프레임워크 안의 흩어짐이 더 큽니다. 1위 Hono+htmx의 가장 비싼 한 번($3.19)이 5위 Next.js의 가장 싼 한 번($2.58)보다 비쌉니다. 한두 칸 차이는 같은 수준으로 보는 편이 맞습니다. 앱이 하나이고 에이전트도 하나입니다. 비용은 API 가격으로 환산한 값이라 실제로 낸 돈과 다릅니다. 원문 저자도 같은 한계를 밝히면서, 지금의 MCP와 스킬이 도움보다 해가 될 수도 있다고 의심합니다. 코드와 결과는 벤치마크 저장소에 있습니다.
AI에게 프런트엔드를 맡길 때 쓰는 프레임워크를 댓글로 남겨 주시기 바랍니다.