Lovable migra do Next.js para TanStack Start

Motivação e contexto

A Lovable migrou o lovable.dev - site com mais de 42 milhões de visitantes únicos mensais, cerca de 400 rotas e 910 mil linhas de código não gerado - de Next.js hospedado na Vercel para TanStack Start rodando na própria infraestrutura da Lovable. As razões declaradas são dogfooding (sentir as dores dos usuários), testar os limites de escala de um único app na plataforma e transferir conhecimento interno para o agente de construção que atende todos os usuários.

Arquitetura de hospedagem

Cada app publicado na Lovable é construído como um worker para o runtime workerd da Cloudflare. Um worker de entrada carrega dinamicamente o código de cada app em um isolate V8 isolado - alternativa mais barata que processos separados. O custo de instanciação é proporcional ao tamanho do bundle (de 4 ms a 1 s), e os isolates são cacheados e reutilizados, o que torna viável servir mais de 60 milhões de apps. O lovable.dev passou a ser servido pelo mesmo mecanismo, com menos de 200 linhas de código específicas.

Estratégia de migração

A migração durou cerca de seis meses, durante os quais o código cresceu de 350 mil para mais de 850 mil linhas. A abordagem foi gradual, mantendo ambos os frameworks em paralelo. Um proxy worker decidia, por rota e por usuário, qual framework servia cada requisição. As rotas foram agrupadas em cinco conjuntos principais conforme jornadas típicas de usuário, minimizando navegações duras entre frameworks. A View Transitions API do navegador suavizou a experiência visual dessas transições. Feature flags controlavam o rollout por grupo, com stickiness para manter cada usuário no mesmo framework dentro de um grupo.

O código foi reorganizado em uma camada compartilhada (90–95% do total) com regras de lint que impediam importações de qualquer framework. Adapters baseados em aliases de importação do TypeScript permitiram que código compartilhado usasse APIs como navegação sem depender de nenhum framework específico.

Papel da IA na migração

Agentes de código realizaram a maior parte do trabalho de migração. O autor extraiu prompts reutilizáveis como "skills" que permitiam pedir a um agente "mova o componente X para o código compartilhado" e obter um PR pronto para produção. A abstração foi elevada: em vez de planejar manualmente cada tarefa, um agente de planejamento recebia uma métrica mensurável (por exemplo, quantas ferramentas de agente ainda tinham UI em Next.js) e identificava lotes coerentes de trabalho para agentes de implementação. Uma automação de revisão verificava que cada PR mesclado não introduzisse código não portável. O resultado foi que um único desenvolvedor, com apoio de agentes, completou o que antes exigiria coordenação de múltiplas equipes.

Rollout e incidente

O tráfego foi alternado grupo a grupo, com etapas de teste interno, 1% dos usuários e escalonamento até 100%. O processo levou cerca de dois meses. Houve um incidente de 11 minutos em que a taxa de erro subiu de 0,1% para cerca de 50%: isolates estavam sendo eliminados por exceder o limite de memória (128 MB) após servir menos de 10 requisições, quando o normal é 500 a 10 mil. A causa raiz foi um JSON estático de vários megabytes parseado no nível do módulo. Correções incluíram parsing sob demanda, exclusão de campos não usados em APIs de listagem e substituição de código client-only por stubs no bundle de servidor, economizando cerca de 18 MB de memória.

Comparação com Next.js

O autor relata melhor experiência de desenvolvimento local (início em 10 s e 1,5 GB de RAM versus 70 s e 8 GB no Next.js), abstrações mais intuitivas no TanStack Start e melhor desempenho de agentes de IA com o novo framework - atribuído a um corpus de treino menor porém mais consistente. A desvantagem é a necessidade de configuração extensiva de bundling: 17 plugins de build customizados.

Resultados

TTFB mediano caiu 49%. Builds de produção em CI caíram de mais de 12 minutos para 6–9 minutos. A Lovable agora permite que funcionários não técnicos editem o próprio lovable.dev via self-editing. A empresa planeja permitir importação de apps Next.js no futuro.