The era of vibe-coding is over, or at least it should be. In a rigorous new benchmark published on October 28, 2026, developer Nolan Lawson quantified the actual cost of using AI agents to build applications across twelve different JavaScript frameworks. By instructing Claude Opus 5.5 to build a Pokémon data app using the PokéAPI, Lawson discovered that framework choice directly impacts development time, token consumption, and monetary cost, challenging the notion that all modern frontend stacks are created equal in the agentic era.

The True Cost of Abstraction

The results are stark. Hono combined with htmx emerged as the most cost-efficient stack, with a median build cost of just $2.67 per run. In contrast, Angular was the most expensive, clocking in at a median of $4.97. This nearly twofold difference is not just about API pricing; it reflects the underlying complexity the AI had to navigate. SvelteKit, Gracile+Lit, and Angular all proved significantly more expensive to build, largely because the agents struggled with newer versions or complex migration guides that were not fully represented in the training data.

Token Usage and Code Bloat

Beyond the dollar sign, the token count reveals the maintenance burden. The Angular agent consumed a median of 9.76 million tokens per run, compared to just 3.85 million for Nuxt. This discrepancy highlights a critical infrastructure reality: verbose frameworks require more context, leading to higher latency and cost. Lawson noted that the stochastic nature of LLMs means these numbers have variance, but the trend is clear. Hono+htmx required only 1,370 lines of code to satisfy the spec, whereas Angular required over 2,000 lines. In an agentic workflow, more lines mean more tokens for every future edit and bug fix.

Performance and Accessibility Parity

Interestingly, the heavy hitters in terms of cost did not necessarily deliver superior out-of-the-box performance for this specific use case. Lighthouse scores for Performance and Accessibility were nearly saturated across all frameworks, with most scoring 100 in accessibility. However, JavaScript bundle sizes varied wildly. Astro sent 0 KiB of JavaScript, while Next.js shipped 142 KiB. Total Blocking Time (TBT) also favored lighter frameworks, with Astro, Hono+htmx, and Gracile+Lit hitting 0 ms, compared to 103 ms for Angular. The benchmark suggests that for content-heavy sites, the 'blazing fast' marketing claims of heavy SPAs often fail to materialize in real-world AI-generated code.

Key Takeaways

  • Hono+htmx and Astro offer the lowest AI development costs, averaging under $3 per run.
  • Angular and SvelteKit are significantly more expensive, costing nearly $5 per run due to higher token usage and code bloat.
  • Accessibility scores are consistently high across all tested frameworks, suggesting AI agents handle ARIA roles well regardless of the stack.
  • JavaScript bundle size is the primary differentiator for performance, with Next.js and Angular shipping the heaviest payloads.

The Bottom Line

Stop picking frameworks based on vibes. If you are using AI agents, you are paying for their confusion and verbosity; choose the stack that minimizes token waste and code bloat, or prepare to burn cash on abstractions your agents don't even understand.