Quando alguém mencionava TanStack dois anos atrás, a associação imediata era React Query, a library que simplificou data fetching e cache de estado assíncrono. Em 2026, essa associação já não dá conta do que o TanStack se tornou. O ecossistema hoje inclui oito pacotes que cobrem desde roteamento type-safe até um banco de dados reativo no navegador, passando por formulários, gerenciamento de estado e um toolkit de IA agnóstico de provedor.

O State of React 2025, publicado em fevereiro de 2026, confirma o que muitos devs já percebiam no dia a dia: TanStack Query alcançou 68% de uso entre desenvolvedores React, com 42% de sentimento positivo e apenas 1% de sentimento negativo. Mas o dado que chama atenção é o crescimento acelerado do TanStack Router e a entrada do TanStack Start como alternativa ao Next.js. O que era uma library virou plataforma.

De React Query a TanStack: a timeline de uma expansão

Tanner Linsley criou React Query em 2019 para resolver um problema específico: fetching e cache de dados do servidor em aplicações React sem a cerimônia do Redux. A library pegou tração rápido porque fazia uma coisa e fazia bem.

O ponto de inflexão veio quando Linsley decidiu tornar a base do código framework-agnostic. O rebrand de React Query para TanStack Query na v4 (2022) não foi cosmético — foi arquitetural. O core passou a ser JavaScript puro, com adapters para React, Vue, Solid e Angular. A mesma decisão se estendeu para cada nova library do ecossistema.

Hoje a família TanStack tem oito membros: Query, Router, Table, Virtual, Form, Store, DB e AI, com o Start (meta-framework) construído sobre o Router. Cada peça é independente, mas todas compartilham três princípios que Linsley repete em toda entrevista: headless (sem opiniões sobre UI), type-safe (tipagem completa sem anotações manuais) e framework-agnostic (core em JS puro, adapters por framework).

Linsley deixou o emprego para trabalhar no TanStack em tempo integral, o que acelerou o ritmo de releases. Em 2025 foram publicadas versões estáveis do Form v1, beta do DB e alpha do AI, três pacotes que antes não existiam.

TanStack Query: 68% de uso entre devs React

O TanStack Query continua sendo o centro gravitacional do ecossistema. Os números do State of React 2025 falam por si: 68% de uso, o que faz dele a solução de data fetching mais adotada na comunidade React, à frente do SWR e do Apollo Client.

A v5, lançada em outubro de 2023, trouxe mudanças que amadureceram a API. O status loading foi renomeado para pending, e a flag isLoading passou a se chamar isPending. Uma nova isLoading foi adicionada com semântica diferente: só retorna true quando isPending && isFetching, ou seja, quando não há dados em cache e uma requisição está ativa. O cacheTime virou gcTime porque o que ele controla é garbage collection de queries inativas, não cache. O hook useSuspenseQuery simplificou a integração com React Suspense ao eliminar a flag suspense: true.

Mas o que sustenta a adoção não são features individuais. É o modelo mental. O Query separa estado do servidor (dados remotos que precisam de cache, revalidação e sincronização) do estado do cliente (UI local como modais abertos, filtros selecionados). Essa separação é simples de explicar a um dev júnior e resolve 80% dos problemas que times tinham com Redux para dados assíncronos.

import { useQuery } from '@tanstack/react-query';

interface User {
  id: number;
  name: string;
  email: string;
}

function UserProfile({ userId }: { userId: number }) {
  const { data, isPending, error } = useQuery<User>({
    queryKey: ['user', userId],
    queryFn: () => fetch(`/api/users/${userId}`).then(res => res.json()),
    staleTime: 5 * 60 * 1000,
  });

  if (isPending) return <p>Carregando...</p>;
  if (error) return <p>Erro ao carregar usuário</p>;

  return <h2>{data.name}</h2>;
}

Com mais de 744 milhões de downloads acumulados no npm e 4.200+ projetos dependentes, o Query é a fundação sobre a qual o resto do ecossistema se construiu.

TanStack Router e Start: a alternativa type-safe ao Next.js

Se o Query resolveu data fetching, o Router atacou um problema que ninguém achava que precisava ser resolvido: roteamento type-safe. O TanStack Router trata search params, path params e route context como cidadãos de primeira classe no sistema de tipos do TypeScript.

Na prática, isso significa que se você tem uma rota /users/$userId com um search param tab, o TypeScript sabe exatamente quais parâmetros existem, quais são obrigatórios e quais tipos eles têm. Alterar o nome de um parâmetro causa erro de compilação em todo link que referencia aquela rota. Esse nível de inferência é o que a documentação chama de "lossless type inference". Nenhuma informação de tipo é perdida entre a definição da rota e o componente que a consome.

import { createFileRoute } from '@tanstack/react-router';

export const Route = createFileRoute('/users/$userId')({
  validateSearch: (search: Record<string, unknown>) => ({
    tab: (search.tab as string) || 'profile',
  }),
  loader: async ({ params }) => {
    // params.userId é inferido como string automaticamente
    const res = await fetch(`/api/users/${params.userId}`);
    return res.json();
  },
});

O TanStack Start é o meta-framework construído sobre o Router. Lançado como Release Candidate v1 em setembro de 2024 e amadurecendo ao longo de 2025, ele oferece SSR completo, streaming, server functions e deploy universal, tudo integrado com Vite em vez de webpack.

A comparação com o Next.js é inevitável, e os desenvolvedores estão fazendo essa comparação com os pés. O TanStack Router teve crescimento expressivo em adoção no State of React 2025. Os motivos mais citados incluem server functions type-safe (sem a separação mental entre client e server components do Next.js), baseline de bundle menor (~42KB gzipped vs ~92KB do Next.js, com variação conforme a proporção de componentes interativos) e transparência total no que acontece durante build e runtime.

O Start ainda é jovem. Não tem o ecossistema de middleware, plugins e integrações que o Next.js construiu ao longo de anos. Mas para times que priorizam tipagem e querem controle sobre a stack sem abstrações opacas, ele se posiciona como a alternativa mais séria que surgiu nos últimos anos.

TanStack DB: queries reativas com differential dataflow

Este é o pacote mais ambicioso do ecossistema. O TanStack DB é um banco de dados reativo que roda no navegador, construído sobre differential dataflow, uma técnica de computação incremental que recalcula apenas o que mudou em vez de re-executar queries inteiras.

O modelo funciona com dois conceitos centrais: collections e live queries. Uma collection é um store normalizado de registros com schema definido. Uma live query é uma consulta reativa que roda contra uma ou mais collections e atualiza automaticamente quando os dados subjacentes mudam.

O diferencial está na performance. Queries tradicionais (filtrar, agrupar, juntar) precisam varrer todos os dados a cada mudança. Com differential dataflow, o TanStack DB propaga apenas os deltas. Nos benchmarks publicados pela equipe, live queries em collections com 100.000+ registros atualizam em menos de 1 milissegundo em um laptop moderno.

import { createCollection, useLiveQuery } from '@tanstack/react-db';
import { queryCollectionOptions } from '@tanstack/query-db-collection';

const todosCollection = createCollection(
  queryCollectionOptions({
    queryKey: ['todos'],
    queryFn: async () => {
      const res = await fetch('/api/todos');
      return res.json();
    },
    getKey: (todo) => todo.id,
  })
);

// Em um componente React, a live query atualiza automaticamente
function ActiveTodos() {
  const todos = useLiveQuery((query) =>
    query.from({ todosCollection }).where('@completed', '=', false)
  );

  return (
    <ul>
      {todos.map((todo) => (
        <li key={todo.id}>{todo.title}</li>
      ))}
    </ul>
  );
}

O DB entrou em beta em agosto de 2025 e alcançou a versão 0.5 com query-driven sync, a capacidade de sincronizar dados do servidor com base nas queries ativas em vez de subscriptions globais. Isso significa que o DB compara predicados entre todas as live queries e deduplica requests automaticamente: múltiplos componentes pedindo os mesmos dados disparam uma única chamada de rede.

Para mutações otimistas, o DB permite atualizar queries localmente de forma instantânea e reconciliar com o servidor depois, com o store normalizado garantindo coerência entre todas as views afetadas. É a mesma ideia do optimisticUpdate do Query, mas aplicada a um modelo relacional completo.

TanStack Form, Store e AI: os módulos que completam o puzzle

O TanStack Form v1 foi lançado em 2025 e resolve formulários de um jeito diferente do React Hook Form. Em vez de tratar cada campo como uma ref isolada, o Form usa o TanStack Store internamente, um gerenciador de estado baseado em signals que atualiza apenas os componentes que dependem dos campos que mudaram.

O resultado é que formulários com dezenas de campos não re-renderizam a árvore inteira a cada keystroke. O Form suporta React, Vue, Angular, Solid e Lit, seguindo o padrão framework-agnostic do ecossistema. No State of React 2025, o TanStack Form apareceu com 21% de uso (subindo 8 posições), ainda atrás do React Hook Form com 74%, mas com crescimento acelerado.

O TanStack Store é mais discreto. É a camada de gerenciamento de estado que usa signals para reatividade granular. Outros pacotes do ecossistema (como o Form) o consomem internamente, mas ele também pode ser usado diretamente para estado global ou compartilhado entre componentes.

O pacote mais recente é o TanStack AI, lançado em alpha em dezembro de 2025. A proposta é ser o "Switzerland da tooling de IA", uma camada agnóstica que funciona com qualquer provedor. O alpha já inclui adapters para OpenAI, Anthropic, Gemini e Ollama, com suporte a JavaScript/TypeScript, Python e PHP.

O que diferencia o TanStack AI de SDKs proprietários é o sistema de tools isomórficas. Você define uma tool com toolDefinition() e fornece implementações para .server() ou .client(), permitindo que a mesma definição de tool rode no servidor (com acesso a banco) ou no cliente (com acesso ao DOM). A tipagem do TypeScript infere quais opções são válidas para cada provedor e modelo: trocar de GPT-4 para Claude gera erros de compilação se você usar opções incompatíveis.

import { chat } from '@tanstack/ai';
import { createAnthropicChat } from '@tanstack/ai-anthropic';

const anthropic = createAnthropicChat(process.env.ANTHROPIC_API_KEY!);

const stream = chat({
  adapter: anthropic('claude-sonnet-4-5'),
  messages: [
    { role: 'user', content: 'Explique differential dataflow em 3 frases' },
  ],
});

O que muda na prática para quem usa React

A expansão do TanStack cria uma situação nova para quem monta stacks React. Antes, a decisão era simples: React Query para fetching, React Router ou Next.js para rotas, React Hook Form para formulários, Redux ou Zustand para estado. Cada library tinha seu próprio sistema de tipos, suas próprias convenções e sua própria filosofia.

Com o TanStack, existe a opção de usar um ecossistema onde tudo foi desenhado para funcionar junto. O Router alimenta o Start, que usa o Query para data fetching, que serve de base para o DB. O Form usa o Store para reatividade. O AI se integra com o Query para cache de respostas. A tipagem flui de ponta a ponta sem adaptações.

Isso não significa que adotar tudo de uma vez seja a decisão certa. O TanStack DB ainda está em beta. O Start é RC. O AI é alpha. Cada pacote tem maturidade diferente, e trocar toda a stack de uma vez é exatamente o tipo de decisão que causa problemas em projetos reais.

A abordagem que faz mais sentido é incremental. A maioria dos times que usa TanStack hoje começou pelo Query, que é o pacote mais maduro e com menor risco de adoção. O próximo passo natural é o Router, especialmente se o time sente dor com tipagem de rotas. O Start entra na conversa quando chegar a v1 estável e o time avaliar que a troca do Next.js vale a curva de aprendizado.

O DB é para quem tem problemas reais de performance com re-renders em listas grandes ou precisa de sincronização local-first. O Form é para quem quer reatividade granular sem a complexidade do React Hook Form em formulários dinâmicos. O AI é experimental e mais indicado para quem quer evitar lock-in com SDKs proprietários desde o início de um projeto.

Conclusão

O TanStack em 2026 não é mais uma library — é uma resposta coerente à fragmentação do ecossistema React. Tanner Linsley construiu cada peça com a mesma arquitetura (core JS puro + adapter por framework), o mesmo sistema de tipos (inferência lossless do TypeScript) e a mesma filosofia (headless, sem opiniões sobre UI).

O State of React 2025 mostrou que o mercado está respondendo: 68% de uso no Query, crescimento acelerado no Router, e o Start surgindo como a primeira alternativa ao Next.js que desenvolvedores estão realmente considerando em produção. A adoção incremental, começando pelo Query e expandindo conforme a necessidade, é a estratégia que combina o benefício do ecossistema unificado com o pragmatismo de não trocar tudo de uma vez.

Os pacotes mais novos (DB, AI) ainda precisam amadurecer. Mas a direção está clara: o TanStack quer ser para o frontend o que o Spring é para o Java. Não um framework monolítico, mas um conjunto de módulos que funcionam melhor juntos do que separados.

Referências pesquisadas nesta publicação