Hono paired with htmx was the cheapest JavaScript stack to build in a head-to-head test of AI coding agents, and Angular was the most expensive. The benchmark, published by a web developer, had Claude Opus 5.5 build the same Pokémon app in 12 frameworks and measured what each one cost to produce.
How was the AI coding benchmark run?
The app is a small but non-trivial site that pulls data from the PokéAPI. Users can list Pokémon with their types, moves and game data, then search and filter them. Each agent ran in a sandbox and was checked against a conformance suite built on the accessibility tree, which kept the agents from simply pre-generating static HTML. Where a framework offered an official MCP server or agent skills, the agents were told to use them. The author ran each framework five times and used the median, except for Angular, which produced two broken apps and was reported from three runs.
Which JavaScript framework was cheapest to build with AI coding agents?
Cost figures come from the API prices that Claude Code reports, not from the author's actual spending. He pays a flat monthly subscription, so the numbers are a proxy. Hono with htmx had a median of $2.67 per run, followed closely by Astro at $2.76 and Nuxt at $2.82. At the other end, SvelteKit came in at $4.28, Gracile with Lit at $4.65 and Angular at $4.97. The author noted that the ranges overlap, so React Router's cheapest run was still less expensive than the priciest Hono run.
The more expensive frameworks showed some consistent patterns. In every SvelteKit run, the agents read the SvelteKit v3 migration guide, which the author suspects is too new to appear in the model's training data. Gracile was less familiar to the agents, which either cloned its repository or read compiled source from node_modules. Angular's cost tracked its overall code size.
Time and token use followed a similar order. Astro had the shortest median build at 8.2 minutes, and Angular had the longest at 17.2 minutes, with a range of 9.8 to 23.7. Nuxt used the fewest tokens at a median of 3.85 million, while Angular used the most at 9.76 million. The author said Vanilla, which meant Vite with TypeScript and no UI framework, was surprisingly slower and more costly than several frameworks, which he said suggests that a framework can help even when it is not needed.
Lighthouse results were tightly clustered. Accessibility scored 100 for all 12 frameworks, and performance scored between 97 and 100. Cumulative Layout Shift was zero for everything except Vanilla. The more revealing number was the amount of JavaScript each page sent. Astro sent essentially none, at 0 kilobytes. Vanilla sent 7 KiB and Hono with htmx sent 18 KiB. Next.js sent 142 KiB, the most of any framework tested. Largest Contentful Paint varied widely between runs and generally favored the server-rendered sites that paint with HTML before client-side code runs. The author said the Next.js spread was largely due to one app that did not lazy-load images, while the other four did.
Angular had its own problem. In two runs, the agent built a server-rendered app that rejected any request not coming from localhost, even though the instructions said the app would sit behind a reverse proxy. The author counted that as a failure to follow the spec and did not rerun those iterations.
Why did Angular cost the most in the AI coding benchmark?
Code size is where the author found the clearest contrast. Hono with htmx had a median of 1,370 lines of non-blank source code. Angular had 2,009. The author wrote that Hono with htmx could do roughly the same work as Angular with about 70 percent of the code, which matters in an agentic workflow because more code means more tokens for future edits.
The author points to several limits. The test covered one kind of app, a content-heavy site with little interactivity. Results were noisy: agents sometimes wandered off on tangents, and Lighthouse's largest-element metric could pick different images from one run to the next. Usage of the official tools was also uneven. The Nuxt MCP was never used, and Next.js agents read its skill file in only one of five runs. Lighthouse and Core Web Vitals also tend to favor static and server-rendered sites over single-page apps, so the author expects the results to look different for dashboards or interactive tools.
The benchmark code is on GitHub, and the author invited others to run or fork it. He also said he suspects that current MCPs and skills may be doing more harm than good, and that framework authors could improve their results. His larger argument is that developers should test their assumptions about tools, rather than rely on claims about speed or agent friendliness that come without evidence.
Cet article a été rédigé avec l'assistance de l'IA.
News Factory APP - actualités agentiques pour booster votre SEO et AEO.