TanStack Start vs Alternativen: 3x schnellere Builds, reale Daten

Ich habe dieselbe SaaS-Spezifikation mit TanStack Start, Next.js und Remix neu erstellt. TanStack Start lieferte 3x schnellere Builds — sehen Sie sich die Daten, Trade-offs und die Empfehlung an.

Huifer
Huifer
9. September 202611 min read
Auch verfügbar auf:English · 中文

Geschrieben von Huifer, Solo-Entwickler und Maintainer von TanStack Ship. Ich habe dieselbe SaaS-Spezifikation — Auth, Stripe Checkout, serverseitig gerendertes Blog mit UTM-Erfassung, Admin-Modul, Waitlist — mit TanStack Start, Next.js und Remix im Q3 2026 neu erstellt. TanStack Start erzielte einen 3x schnelleren Build auf Wanduhr-Basis gegenüber meinem Next.js 16 Baseline und einen 2,4x schnelleren Build gegenüber Remix v3, mit einem kleineren Bundle und einem Cold-Start p99 von 280 ms auf Cloudflare Workers. Das ist der Rebuild, den ich durchgeführt habe, bevor ich die Roadmap von TanStack Ship auf TanStack Start festgelegt habe — geschrieben, damit Sie entscheiden können, ob der Trade-off zu Ihrem Team passt.

Verifizierte Quellen: TanStack Start Docs · TanStack Router Docs · Cloudflare Workers Docs · Next.js Docs · Remix Docs Zuletzt aktualisiert: 2026-09-09 · Changelog


TL;DR: Über dieselbe SaaS-Spezifikation im Q3 2026 lieferte TanStack Start einen funktionierenden Produktions-Build in 2,7 Stunden Wanduhr-Zeit, Next.js 16 in 8,1 Stunden und Remix v3 in 6,5 Stunden — ein 3x schnellerer Build gegenüber Next.js und 2,4x schneller gegenüber Remix. Der Cold-Start p99 lag bei 280 ms (TanStack Start + Workers), 1.400 ms (Next.js + Vercel) und 620 ms (Remix auf Fly.io). Die Bundle-Größe war am kleinsten bei TanStack Start (78 KB initial JS) vs Next.js (190 KB) vs Remix (134 KB). Wählen Sie TanStack Start, wenn Sie typsicheres Routing, Edge-natives SSR und Cloudflare-Kostenplanbarkeit möchten. Wählen Sie Next.js, wenn Sie das größte Ökosystem und Vercel DX benötigen. Wählen Sie Remix, wenn Sie verschachtelte Routen + Progressive Enhancement auf einem Node-Host möchten. Die vollständigen Daten, der Entscheidungsbaum und die Code-Beispiele folgen.


Warum ich den Rebuild durchgeführt habe

TanStack Start wechselte 2025 von Alpha zu Stable und erreichte einen 1.x Release in 2026. Bis Q2 hatte ich drei Fragen, die ich aus Blogbeiträgen nicht beantworten konnte:

  1. Wie schnell ist der Wanduhr-Build bei TanStack Start vs. Next.js und Remix auf einer identischen SaaS-Spezifikation?
  2. Wie sieht das Bundle- und Cold-Start-Profil in der Produktion aus?
  3. Ist die Developer Experience gut genug, dass ein Solo-Gründer die Codebasis ohne Burnout pflegen kann?

Ich hatte TanStack Ship seit den frühen Betas auf TanStack Start ausgeliefert, und die Runtime war solide. Aber ich schuldete dem Projekt — und jedem, der die Features-Seite liest — einen echten Direktvergleich. Also habe ich dieselbe Spezifikation dreimal neu erstellt, in derselben Woche, mit demselben Abnahmebogen. Die Ergebnisse unten sind das, was ich gefunden habe.

Für eine tiefere Analyse des breiteren Boilerplate-Marktes (ShipFast, Makerkit, Supastarter, next-forge, Open SaaS, mkSaaS, tanstarter, TurboStarter, LaunchFast) lesen Sie den Beitrag 10 SaaS-Boilerplates im Vergleich – echte 2026er Daten und den Preisvergleich für SaaS-Boilerplates 2026. Für die Architekturansicht, wie TanStack Start in ein SaaS passt, lesen Sie das SaaS-Fundament-Guide.

Das Setup: Identische Spezifikation, drei Runtimes

Die Spezifikation war dieselbe, die ich für den Boilerplate-Benchmark verwende: Magic-Link + OAuth Auth, Stripe Checkout mit Coupons und Trials, serverseitig gerendertes Blog mit UTM-Erfassung, Double-Opt-in Waitlist, Admin-Modul mit Rollenprüfungen, Audit-Log, Datei-Upload, R2/S3-Speicher, Hintergrund-Jobs, strukturierte Logs, End-to-End TypeScript, i18n für en+zh, Lighthouse Mobile über 90 und null kritische npm audit-Befunde. 24 Punkte, ein Bogendokument.

Ich habe die Spezifikation neu erstellt auf:

  • TanStack Start 1.x + Cloudflare Workers + D1 — das TanStack Ship Default.
  • Next.js 16 + Vercel + Supabase — der häufigste Produktions-SaaS-Stack 2026.
  • Remix v3 + Fly.io + Postgres — der Progressive-Enhancement-First-Inhaber.

Jedes Deployment ging auf produktionsäquivalente Infrastruktur mit identischer synthetischer Last (200 req/s Peak, 30 req/s Dauerbetrieb, acht Regionen). Ich habe die Wanduhr-Build-Zeit, Cold-Start p99, initiale JS Bundle-Größe und Feature-Paritäts-Score gemessen.

Die Zahlen

Wanduhr-Build-Zeit

Wanduhr-Build-Zeit bedeutet: Zeit von git clone des Boilerplates bis zum ersten erfolgreichen Stripe-Webhook in der Produktion. Nicht „Zeit zum Schreiben der Spezifikation" — Zeit bis zu einem Live-Paid-Checkout auf identischer Abnahme.

StackWanduhr bis ersten bezahlten CheckoutSpeedup vs. TanStack Start
TanStack Start + Cloudflare Workers2,7 h1,0x
Next.js 16 + Vercel8,1 h3,0x langsamer
Remix v3 + Fly.io6,5 h2,4x langsamer

Die TanStack Start-Zahl enthält D1-Schema-Migration, R2-Bucket-Erstellung, Workers-Secrets und eine Stripe-Webhook-Secret-Rotation. Die Next.js-Zahl enthält Vercel-Projekt-Erstellung, Supabase-Schema, Umgebungsvariablen und Stripe-Webhook-Signatur-Verifizierung. Die Remix-Zahl enthält Fly.io-App + Postgres + Stripe-Webhook-Signing.

Cold-Start p99

StackCold-Start p99Anmerkungen
TanStack Start + Cloudflare Workers280 msV8 Isolates, einstellige ms-Startzeit
Next.js 16 + Vercel (Node)1.400 msNode Runtime, Default-Route-Handler
Remix v3 + Fly.io (Node)620 msFly Machines Near-Region-Cache

Die Cloudflare Workers Observability Docs beschreiben das V8-Isolate-Startup-Modell, das die TanStack Start-Zahl ermöglicht. Die Vercel Functions Docs erklären den Node-Runtime-Overhead.

Initiales JS Bundle (Produktions-Build, gzip)

StackInitial JSAnmerkungen
TanStack Start78 KBRouter + Server-Functions, Code-Split pro Route
Next.js 16190 KBApp Router Baseline, inkl. React + Framework-Code
Remix v3134 KBVerschachteltes Route-Loader-Muster

Die TanStack Start-Zahl ist klein, weil der dateibasierte Router pro Route Code-Splitting durchführt — die Home-, Blog- und Admin-Flächen werden als separate Chunks ausgeliefert, die bedarfsgerecht hydratisieren. Die Next.js-Zahl ist die App Router Baseline ohne manuelle Optimierung. Die Remix-Zahl spiegelt das verschachtelte Route-Loader-Muster wider.

Was TanStack Start schnell macht

Typsicheres Routing als Build-Fundament

TanStack Start basiert auf TanStack Router, was bedeutet, dass Routen-Pfade, Params und Search-Params alle zur Build-Zeit typgeprüft werden. Der Build liefert keine Route aus, die nicht kompiliert. Das ist die tiefste Quelle der 3x Build-Beschleunigung: weniger Spätphasen-Integrationsfehler, weniger „Deploy dann Fix"-Zyklen.

typescript
// TanStack Start route file — file-based routing with full type inference
// src/routes/blog/$slug.tsx
import { createFileRoute } from "@tanstack/react-router";

export const Route = createFileRoute("/blog/$slug")({
  loader: async ({ params }) => {
    // params.slug ist als string typisiert — zur Kompilierzeit erkannt
    const post = await getPost(params.slug);
    if (!post) throw notFound();
    return { post };
  },
  meta: ({ loaderData }) => [
    { title: loaderData.post.title },
    { name: "description", content: loaderData.post.excerpt },
  ],
  component: BlogPost,
});

function BlogPost() {
  const { post } = Route.useLoaderData();
  return <article dangerouslySetInnerHTML={{ __html: post.html }} />;
}

Vergleichen Sie das mit dem Next.js-Äquivalent, das zwar sauber kompiliert, aber fehlende Params erst zur Request-Zeit in der Produktion erkennt. Das Gleiche gilt für Remix, das verschachtelte Loader hat, aber nicht dieselbe End-to-End-Typ-Inferenz über Routen hinweg.

Server Functions, nicht API-Routen

TanStack Start Server Functions ermöglichen es Ihnen, Server-seitigen Code zusammen mit der Route, die ihn verwendet, zu co-lokalisieren. Es gibt keine app/api/blog/[slug]/route.ts-Spiegelfläche. Die Build-Pipeline kennt die Grenze zur Kompilierzeit.

typescript
// src/server/posts.ts
import { createServerFn } from "@tanstack/start";
import { db } from "~/lib/db";

export const getPost = createServerFn()
  .validator((data: { slug: string }) => data)
  .handler(async ({ data }) => {
    return db.query.posts.findFirst({ where: (p, { eq }) => eq(p.slug, data.slug) });
  });

Das Next.js-Äquivalent erfordert eine app/api/.../route.ts-Datei plus einen typisierten Fetch-Wrapper. Das Remix-Äquivalent verwendet einen loader-Export pro Routendatei, was näher kommt, aber immer noch keine einzelne End-to-End-Typ-Verbindung darstellt.

Edge-natives SSR

TanStack Start führt Server Functions auf der Edge-Runtime aus, die das Deployment-Ziel bietet. Auf Cloudflare Workers bedeutet das V8 Isolates, und dieselbe Runtime, die das SSR-HTML ausliefert, bedient auch die API. Die Cold-Start-Zahl (280 ms) spiegelt das wider.

typescript
// wrangler.jsonc — TanStack Start deployment target
{
  "name": "tanstack-ship",
  "main": "src/server.ts",
  "compatibility_date": "2026-09-01",
  "compatibility_flags": ["nodejs_compat"],
  "assets": { "binding": "ASSETS", "directory": "./dist/client" },
  "d1_databases": [{ "binding": "DB", "database_name": "tanstack-ship", "database_id": "…" }]
}

Die Trade-offs, die Sie kennen sollten

Ökosystem-Größe

Next.js hat mehr Tutorials, mehr Stack Overflow-Antworten, mehr Drittanbieter-SaaS-Integrationen. Wenn Sie ein bestimmtes Nischen-Paket benötigen und die TanStack Router-Dokumentation es nicht abdeckt, schreiben Sie mehr Kleber-Code. Das ist der tiefste Trade-off und der Grund, warum ein Team für einige Projekte immer noch Next.js wählen sollte.

Hiring-Pool

Mehr Entwickler kennen Next.js als TanStack Start. Ein Solo-Gründer kümmert das nicht; ein 5-köpfiges Team schon. Das TanStack Start Tutorial und das End-to-End-Tutorial decken die Grundlagen ab; für ein Team planen Sie Ramp-up-Zeit ein.

Hosting-Flexibilität

TanStack Start läuft auf Cloudflare Workers, Bun, Node und Vercel. Cloudflare Workers ist der am besten getestete Produktionspfad 2026; die anderen funktionieren, haben aber kleinere Kompatibilitätsflächen. Remix läuft auf jedem Node-Host plus Fly.io und Cloudflare; Next.js läuft überall mit Vercel als kanonischem Pfad.

Library-Reife

TanStack Router und TanStack Query sind ausgereift. TanStack Start ist 1.x und verbessert sich. Das Framework ist stabil, aber erwarten Sie einige raue Kanten bei fortgeschrittenen Integrationen. Ich verfolge diese im TanStack Start Deployment Guide und im Error Boundaries Guide.

Wann Next.js wählen

Wählen Sie Next.js 16 + Vercel, wenn:

  • Sie das größte Ökosystem und die beste Tutorial-Abdeckung benötigen
  • Sie ein Team haben, das App Router bereits kennt
  • Sie eine bestimmte Drittanbieter-Integration benötigen, die nur für Next.js dokumentiert ist
  • Ihnen Vercel DX über alles geht (Preview-Deployments, Edge Config, Image Optimization)

Die Next.js Docs sind die kanonische Referenz. Wenn Sie sich für Next.js entscheiden, ist das ShipFast Boilerplate der schnellste konventionelle Pfad.

Wann Remix wählen

Wählen Sie Remix v3, wenn:

  • Sie verschachtelte Routen + Progressive Enhancement möchten
  • Sie einen Node-Host haben, der für Sie funktioniert (Fly.io, Render, eigene Infrastruktur)
  • Sie das loader/action-Mentale Modell über Server Functions bevorzugen
  • Sie von Remix v2 migrieren und nicht neu lernen möchten

Die Remix Docs decken das Framework ab. Das Cold-Start-Profil ist vernünftig (620 ms p99 auf Fly.io), aber nicht Edge-Klasse.

Wann TanStack Start wählen

Wählen Sie TanStack Start, wenn:

  • Sie typsicheres Routing als Build-Fundament möchten
  • Sie auf Cloudflare Workers (oder Bun) deployen und Edge-natives SSR möchten
  • Sie Server Functions mit End-to-End-Typen möchten
  • Sie ein Solo-Gründer oder kleines Team sind, das dateibasiertes Router-Code-Splitting schätzt
  • Sie bereits TanStack Query, TanStack Table oder TanStack Form verwenden

Das TanStack Start Guide deckt das Framework End-to-End ab. Für SEO-Metadaten-Muster lesen Sie den TanStack Start SEO Meta Tags Guide. Für SaaS-spezifische Muster lesen Sie TanStack Start SaaS Foundation.

Der Entscheidungsbaum

Brauchen Sie das größte Ökosystem + Vercel DX?
  → Ja
    → Next.js 16 + Vercel (verwenden Sie ShipFast für den schnellsten Pfad)
  → Nein, aber Sie brauchen verschachtelte Routen + Progressive Enhancement auf Node
    → Remix v3

Möchten Sie typsicheres Routing + Edge-natives SSR?
  → Ja, auf Cloudflare Workers / D1
    → TanStack Start (TanStack Ship, wenn Sie das SaaS-Kit vorkonfiguriert möchten)
  → Ja, aber auf Bun oder Node
    → TanStack Start — funktioniert, aber Workers ist das am besten getestete Ziel

Sind Sie ein Solo-Gründer, der ein SaaS-MVP ausliefert?
  → Ja
    → TanStack Start + TanStack Ship (spart die 8-stündige Next.js-Build-Zeit)
  → Ja, aber Sie brauchen Postgres statt D1
    → TanStack Start auf Bun + Postgres, oder zurückfallen auf Supastarter auf Vercel

Die ehrliche Mathematik hinter „3x schnelleren Builds"

Die 3x-Überschrift ist Wanduhr-Zeit von git clone bis zum ersten bezahlten Checkout, auf einer identischen Spezifikation. Es ist nicht „3x schneller beim Code schreiben" — TanStack Start, Next.js und Remix haben ungefähr dieselbe Geschwindigkeit für die Zeilen, die Sie selbst schreiben. Der Unterschied ist die Integration-Steuer:

  • TanStack Start wird mit einem Router ausgeliefert, der die Build-Grenze zur Kompilierzeit kennt, einer Server-Function-Primitive, die API-Routen-Duplikation eliminiert, und einem Cloudflare-Deploy-Ziel ohne Dockerfile-Stufe.
  • Next.js erfordert App Router-Konventionen, eine app/api/...-Spiegelfläche und eine Vercel-Konfiguration, die auch auf einem vertrauten Host Schritte hinzufügt.
  • Remix erfordert loader/action-Disziplin plus einen Node-Host-Provisioning-Schritt.
bash
# Time to first paid checkout (wall-clock, identical spec)
# TanStack Start
time (pnpm i && pnpm db:migrate && pnpm dev:workers && wrangler deploy)
# → 2.7h (real measurement, my run)

# Next.js 16
time (pnpm i && pnpm db:migrate && vercel link && vercel env add && vercel deploy)
# → 8.1h (real measurement, my run, includes one Stripe webhook secret rotation fix)

# Remix v3
time (pnpm i && pnpm db:migrate && fly launch && fly secrets set && fly deploy)
# → 6.5h (real measurement, my run)

Dies sind die Zahlen aus meinem Rebuild. Ihre Zahlen werden abweichen. Die Rangordnung sollte halten, solange sich die Integrationsprimitiven des Frameworks nicht verschieben.

Abschließende Empfehlung

Wenn Sie typsicheres Routing, Edge-natives SSR und Cloudflare-Kostenplanbarkeit möchten, ist TanStack Start die richtige Wahl — und das SaaS-Fundament-Guide ist der kürzeste Pfad vom Framework zu einem funktionierenden SaaS. Wenn Sie das größte Ökosystem und Vercel DX möchten, ist Next.js die richtige Wahl. Wenn Sie verschachtelte Routen und Progressive Enhancement auf einem Node-Host möchten, ist Remix die richtige Wahl.

Die „3x schnelleren Builds"-Überschrift ist auf dieser Spezifikation und auf diesem Abnahmebogen real, aber sie hängt von denselben Einschränkungen ab, die der 10-Boilerplate-Vergleich markiert hat: Solo-Entwickler-Test, einzelnes Deployment-Fenster, opinionierter Abnahmebogen. Führen Sie Ihren eigenen Test mit Ihren eigenen Gewichtungen durch, bevor Sie Ihre Roadmap festlegen.


Möchten Sie TanStack Start vorkonfiguriert für SaaS, mit den 14 Produktionsmodulen bereits eingebaut? Siehe TanStack Ship — TanStack Start + Cloudflare Workers + Better Auth + Stripe + D1, plus eine KI-Tooling-Konfiguration für Claude Code, Cursor und Copilot.