LLM Cost Calculator — programmatic SEO

The model directory at /llm-cost-calculator/* is a fully Supabase-backed pSEO surface. Every page renders statically from build-time queries. UGC (edit suggestions, add-a-model requests + votes) writes through Postgres RPCs from the browser anon key.

Routes

URL	Source	Generated by
`/llm-cost-calculator`	`index.astro`	hard-coded
`/llm-cost-calculator/{provider}`	`[provider]/index.astro`	`getAllProviders()` ∩ providers with ≥1 model
`/llm-cost-calculator/{provider}/{model}`	`[provider]/[model].astro`	`getAllModels()` (~2,500 pages)
`/llm-cost-calculator/compare`	`compare/index.astro`	`getTopComparisonPairs(120)`
`/llm-cost-calculator/compare/{a-vs-b}`	`compare/[pair].astro`	`getTopComparisonPairs(1500)`

Total: ~4,200 static pages once seeded.

Where the data comes from

agentcc-gateway/internal/modeldb/litellm.json   ─┐
                                                  ├──→  scripts/seed-models.mjs  ──→  Supabase ──→  build-time read ──→  static HTML
OpenRouter /api/v1/models (gap-fill pricing)    ─┘                                  models_public · model_perf_latest · model_benchmarks_primary

Run order:

supabase/models-schema.sql (paste once into Supabase SQL editor)
node scripts/seed-models.mjs (re-runs weekly; idempotent upsert)
npm run build (Astro reads Supabase, renders 4k+ pages)

What sets this apart from Maxim’s calculator

Dimension	Maxim	Future AGI
Models covered	2,022	2,714+
Modalities	chat only	chat, embedding, image, audio, video, rerank, OCR, moderation
Pricing freshness signal	none	`last_verified_at` on every page, weekly cron
Edit suggestions	no	one-click form per field, queued in DB
Add-a-model requests	no	UGC table with public vote counts
Where-it’s-good guidance	no	derived from caps + benchmarks
Public benchmark scores	no	MMLU / GPQA / HumanEval / SWE-bench / Arena ELO with citations
First-party perf data	no	gateway latency aggregates when available
Routing recommendation	no	copy-paste Agent Command Center config per page
Schema.org	SoftwareApplication only	Product + Offer + FAQPage + BreadcrumbList
Sibling comparisons	no	cheaper / larger context / higher max output
llms.txt	no	every provider hub listed

File layout

src/
├── lib/
│   ├── models-data.ts          # build-time fetcher (anon key, cached)
│   └── models-ugc.ts           # browser RPC client
├── components/
│   └── models/
│       ├── CostCalculator.tsx        # React island (sliders + presets)
│       ├── EditField.tsx             # React island (suggest-edit form)
│       ├── RequestModelButton.tsx    # React island (add-a-model dialog)
│       ├── PriceRow.astro            # pricing-table row + edit-button
│       ├── Spec.astro                # spec dl row + edit-button
│       ├── PerfStat.astro            # latency stat card
│       ├── SiblingColumn.astro       # cheaper/bigger/faster column
│       ├── CompareRow.astro          # head-to-head row with auto-highlight
│       └── HeroStat.astro            # directory hub stat tile
├── pages/
│   └── llm-cost-calculator/
│       ├── index.astro                       # master hub
│       ├── [provider]/
│       │   ├── index.astro                   # provider hub
│       │   └── [model].astro                 # ★ the workhorse
│       ├── compare/
│       │   ├── index.astro                   # comparison hub
│       │   └── [pair].astro                  # one comparison
│       └── README.md                         # this file
public/
└── llms.txt                                  # extended with all provider hubs
supabase/
└── models-schema.sql                         # 8 tables + 3 views + 3 RPCs
scripts/
├── lib/
│   ├── slugs.mjs                             # provider + model slug normalizer
│   └── benchmarks.mjs                        # 24 reference benchmarks
├── seed-models.mjs                           # litellm + OpenRouter loader
└── MODEL-DIRECTORY-SEED.md                   # runbook

Adding a new mode (e.g. `realtime`)

Add to the mode CHECK constraint in models-schema.sql (already includes most modes).
Update MODE_MAP in scripts/lib/slugs.mjs.
Add an entry to MODE_ORDER in index.astro for hub display.
Re-seed.

Adding a new provider

Append to PROVIDERS and LITELLM_PROVIDER_MAP in scripts/lib/slugs.mjs.
Re-run the seed loader — it upserts model_providers and brings in the models.
The provider hub page generates automatically because getStaticPaths filters by providers-with-models.

Adding benchmark scores

For now, populate model_benchmarks from the Supabase dashboard (one row per model × benchmark × source). A future enhancement is a scrape pipeline driven by the benchmarks.upstream_url column.

Adding gateway-derived perf

model_perf rows get inserted by a separate aggregation pipeline (out of scope for this code). The view model_perf_latest picks the freshest gateway row per model automatically.