TanStack Start 1.0: стабильный фулстек-фреймворк для React без культа RSC

В мире React-разработки последние три года прошли под знаменем настойчивого продвижения серверных компонентов (React Server Components, RSC). Команда Vercel и авторы Next.js уверяли индустрию, что будущее веба принадлежит сложному разделению компонентов на серверные и клиентские через директивы 'use client' и 'use server'.

Но чем глубже разработчики погружались в эту парадигму, тем сильнее росло раздражение: утечки замыканий, непредсказуемые ограничения сериализации пропсов, запутанная отладка и ощущение, что простой SPA-фреймворк превратился в неповоротливого монстра, оптимизированного под закрытую облачную платформу одного конкретного вендора.

Таннер Линсли — легендарный автор библиотек React Query, TanStack Table и TanStack Router — пошёл принципиально иным путём. После года полировки в статусе Release Candidate официально вышел стабильный релиз TanStack Start версии 1.0 (в реестре npm релиз опубликован под версией 1.169.x в рамках общего монорепозитория, о чём подробно рассказал выпуск React Status #494).

Это полноценный полнофункциональный (full-stack) React-метафреймворк, который возвращает разработчикам радость создания быстрых веб-приложений без культа серверных компонентов.

Усталость от RSC: почему экосистеме React потребовался другой путь

Таннер Линсли высказался о серверных компонентах предельно откровенно: поддержка RSC в экосистеме долгое время была «обязательным пунктом в резюме инструмента», необходимым лишь для того, чтобы соответствовать маркетинговому нарративу React 19. При этом сам официальный портал tanstack.com демонстративно и полностью отказался от использования RSC.

В чём фундаментальное отличие TanStack Start? Фреймворк сохраняет привычную, понятную и любимую миллионами ментальную модель Single Page Application (SPA). Все компоненты в твоём приложении остаются обычными интерактивными компонентами React. Ты используешь привычные хуки useState, useEffect и библиотеки анимаций без оглядки на то, на клиенте или сервере они выполняются.

При этом приложение получает все преимущества взрослого серверного стека: мгновенный Server-Side Rendering (SSR), потоковую передачу данных (HTML streaming) через Suspense-границы и сквозную строгую проверку типов от базы данных до кнопки в браузере.

Архитектура Server Functions: типобезопасный RPC без директив

Вместо директив компилятора вроде 'use server', которые неявно преобразуют код в сетевые вызовы, TanStack Start предлагает явную и кристально чистую абстракцию — Server Functions (createServerFn).

Ты объявляешь функцию, которая гарантированно выполняется только на сервере. Она имеет прямой доступ к базе данных, секретным ключам окружения и файловой системе. На клиенте вызов этой функции автоматически превращается в типобезопасный RPC-запрос:

// app/services/users.ts
import { createServerFn } from '@tanstack/start';
import { z } from 'zod';

// Валидация входных данных через Zod
const userQuerySchema = z.object({
  userId: z.string().min(1),
});

// Серверная функция: код тела никогда не попадет в клиентский JS-бандл!
export const fetchUserProfile = createServerFn({ method: 'GET' })
  .validator((data: { userId: string }) => userQuerySchema.parse(data))
  .handler(async ({ data }) => {
    // Здесь мы безопасно обращаемся к базе данных
    console.log(`[Server] Чтение пользователя ${data.userId} из БД`);
    
    return {
      id: data.userId,
      displayName: 'Елена Кузнецова',
      role: 'Staff Engineer',
      lastLogin: new Date().toISOString(),
    };
  });

Затем эта функция подключается в маршрутизатор TanStack Router через метод loader. Если пользователь открывает страницу напрямую, данные запрашиваются на сервере во время SSR. Если переходит по ссылке внутри SPA — вызывается клиентский RPC:

// app/routes/users/$userId.tsx
import { createFileRoute } from '@tanstack/react-router';
import { fetchUserProfile } from '../../services/users';

export const Route = createFileRoute('/users/$userId')({
  loader: async ({ params }) => {
    const profile = await fetchUserProfile({ data: { userId: params.userId } });
    return { profile };
  },
  component: UserProfileView,
});

function UserProfileView() {
  const { profile } = Route.useLoaderData();

  return (
    <div className="p-8 max-w-xl mx-auto bg-white rounded-2xl shadow-sm border">
      <h2 className="text-xl font-bold text-slate-900">{profile.displayName}</h2>
      <p className="text-sm text-slate-500 mt-1">{profile.role}</p>
      <div className="mt-4 inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-emerald-100 text-emerald-800">
        Стабильный TanStack Start 1.0
      </div>
    </div>
  );
}

Бенчмарки против Next.js 16.4: до 8.6 раз выше пропускная способность

Появление стабильной версии 1.0 сопровождалось публикацией независимых сравнительных бенчмарков с флагманским Next.js 16.4 на идентичных тестовых приложениях:

• Пропускная способность под нагрузкой: при обработке динамических серверных запросов с обращением к данным TanStack Start выдал в 2.9–8.6 раза больше RPS (запросов в секунду) при одинаковом потреблении ресурсов CPU.
• Скорость сборки: время холодного билда проекта с полной проверкой типов TypeScript в Start оказалось в 1.7 раза быстрее за счёт использования быстрого сборщика Vite.

Неудивительно, что создатель SolidJS Райан Карниато публично поддержал релиз, назвав архитектуру Start «метафреймворком для React, концепцию которого я наконец-то могу искренне поддержать».

Свобода деплоя поверх движка Nitro и когда стоит остаться на Next

Под капотом TanStack Start опирается на открытый серверный движок Nitro (тот самый, что питает Nuxt 4 и Analog). Это даёт разработчику полную независимость от инфраструктуры Vercel: ты можешь развернуть приложение в Docker-контейнере с Node.js, запустить на Cloudflare Workers, деплоить в AWS Lambda, Deno или Bun без покупки коммерческих подписок.

Когда Next.js всё ещё остаётся оправданным выбором?

• Если проект уже глубоко завязан на инфраструктурные фичи Vercel (например, Image Optimization с тонкой настройкой кеширования на Edge или ISR с инвалидацией по тегам).
• Если твоя команда уже потратила год на проектирование кодовой базы под RSC и перестроила все процессы.

Для всех остальных, кто устал от оверхеда серверных компонентов и хочет быстрый, предсказуемый и типобезопасный React, TanStack Start 1.0 стал главным глотком свежего воздуха этого сезона.