TanStack AI RC: что реально работает в продакшене

Когда в моём миграционном проекте замаячила необходимость переписать кучу рутинных API-хендлеров, я наконец добрался до TanStack AI RC. Обещания “AI-first DX” звучали заманчиво, но в работе оказалось не всё так однозначно.

Query-генерация: где AI действительно экономит время

Главный кейс, где TanStack AI показал себя лучше всего — генерация типизированных запросов по описанию. Вместо ручного прописывания:

// До
const { data } = useQuery({
  queryKey: ['todos'],
  queryFn: () => fetch('/api/todos').then(res => res.json())
});

// После AI-генерации
const { data: todos } = useTodoListQuery();

Система корректно подхватывает Zod-схемы из бекенда и генерирует полноценные хуки с TypeScript-тайпингами. На практике это сэкономило мне около 40% времени на CRUD-операциях.

Но есть нюанс: при сложных join-запросах AI часто перестраховывается и генерирует избыточные типы. Приходится вручную чистить Omit<...> и лишние nullable-поля.

Mutation-автокомплит: полезно, но с оговорками

Автодополнение мутаций работает хорошо только при строгом соблюдении конвенций. Например, для useUpdateTodoMutation AI корректно подставляет payload-структуру, но:

1. Часто предлагает устаревшие поля из старых версий API
2. Плохо понимает кастомные валидаторы вроде zod.refine()
3. Путается при работе с FormData-запросами

Лайфхак: если предварительно загрузить в контекст Swagger-схему, качество suggestions заметно улучшается.

Vibe-based кодогенерация: пока не взлетело

Заявленная фича “describe your component, get the code” на деле работает хуже, чем ChatGPT + Copilot. Проблемы, с которыми столкнулся:

• Компоненты генерируются с избыточными rerender-триггерами
• Стили часто попадают inline, хотя в проекте используется CSS Modules
• Нет понимания контекста дизайн-системы

Лучше всего инструмент справляется с генерацией boilerplate-кода вроде:

// Запрос: "table with pagination and sortable columns"
<TanStackTable 
  columns={columns}
  data={data}
  // ...автогенерированные пропсы для пагинации
/>

Но как только пытаешься уточнить что-то вроде “add virtual scrolling with custom row heights”, начинаются проблемы.

Что пробовать в первую очередь

Из всего набора TanStack AI RC я бы рекомендовал внедрять поэтапно:

1. Query-генерацию — уже стабильно и предсказуемо работает
2. Автокомплит для стандартных мутаций — с предзагруженными схемами
3. AI-помощник для тестов — неожиданно полезен для генерации mockResponse

Пока рано говорить о полноценной “AI-first” разработке с TanStack, но как инструмент для сокращения рутины — очень перспективно. Главное — не ожидать от него чудес со сложной бизнес-логикой.

Источник: https://tanstack.com/blog/tanstack-ai-rc