AI NewsProductivityAnnouncement

Nolan Lawson benchmarks 12 JavaScript frameworks for AI coding agent cost

Nolan Lawson built the same Pokemon app in 12 JavaScript frameworks with Claude Code. He measured cost, tokens, time and page weight.

AI News

Editorial2 min read

LinkedInX

Why it mattersFramework choice sets the floor on what every agent run of a project costs. The cheapest and most expensive frameworks differed by $2.30 per build on one small app.

A team picking a JavaScript framework for an AI coding agent asks which one costs the least to build in. Nobody had an answer with a number on it until this week.

Nolan Lawson built the same Pokemon app in twelve JavaScript frameworks with Claude Code, five runs per framework. He recorded the dollar cost Claude Code reported for each run. He also recorded the time, the tokens, the Lighthouse scores and the lines of code the agent wrote. The post went up on 2026-10-28 and the benchmark harness is on GitHub.

The cheapest and most expensive frameworks differed by $2.30

Lawson reports the median of five runs. Hono+htmx came in at $2.67 per build, Astro at $2.76 and Nuxt at $2.82. The most expensive were SvelteKit at $4.28, Gracile+Lit at $4.65 and Angular at $4.97. Angular also failed to produce a working app in two of its five runs. Its figure is the median of three. The spread was 1.86 times from top to bottom.

Lawson calls out two reasons for the slow frameworks. The SvelteKit agent read the v3 migration guide on every run. Lawson thinks the version is too new for Opus 5.5's training data. The Gracile agent did not know the framework. It cloned the Gracile repository or read its compiled source from node_modules.

The code the agent writes is also the code the next agent reads

Angular runs wrote 2,009 lines. Hono+htmx wrote 1,370. Lawson quotes Rich Harris on this: a framework exists to reduce the code you have to maintain. In the agent era this matters again. Every future edit sends that code back to the model as input tokens.

The pattern was clearest on JavaScript bytes sent to the browser. Astro sent 0 KiB on average. Hono+htmx sent 18 KiB. Next.js sent 142 KiB and TanStack Start 118 KiB. Lighthouse scores for Performance, Accessibility and CLS were close to the ceiling on every framework. The real differences showed up in Total Blocking Time and Largest Contentful Paint. Both tracked bundle size.

What the benchmark does not say

Lawson lists the limits in the post. The Pokemon app is content-heavy, close in shape to Wikipedia. A dashboard, a game or a document editor would almost certainly reorder the list. The runs are noisy: React Router's cheapest run was cheaper than Hono+htmx's most expensive one. Lighthouse biases against single-page apps.

Not every framework had an MCP server or a Claude Code skill. When one existed, the agent did not always use it. Lawson installed each one and reports how often it was reached. The TanStack Start agent found its skill files in two of five runs. The Nuxt MCP was never used.

The point, as Lawson writes it: teams in 2026 are picking frameworks on feel. "Frontends are rewritten because some framework or another is 'better for agents'. (Did anyone think to ask the agents?)" The benchmark is one small answer with a method a reader can rerun.

Source

The AI cost of JavaScript frameworks, Nolan Lawson.

This item was written by an AI system from the linked source. Reveneau is responsible for what it publishes.

Share
LinkedInX
Start a project