tRPC или GraphQL: выбор API для fullstack-приложений

Сегодня мы разберемся, какой инструмент лучше выбрать для типизированного API: tRPC или GraphQL. Оба решения популярны, но подходят для разных сценариев. Я расскажу об их плюсах, минусах, покажу примеры кода и дам рекомендации, основанные на личном опыте.

Почему типизированные API это будущее fullstack-разработки

Типизированные API гарантируют, что клиент и сервер «понимают» друг друга без лишних проверок. Они снижают количество runtime-ошибок, ускоряют разработку и делают код предсказуемым. Но у каждого решения есть свои нюансы.

Плюсы типизированных API

1. Безопасность типов
   TypeScript становится стандартом, и типизация на уровне API предотвращает ошибки в запросах и ответах.
2. Автодополнение в IDE
   Клиентские функции знают сигнатуры API, что ускоряет написание кода.
3. Снижение нагрузки на документацию
   Типы заменяют часть ручного описания методов.

Минусы типизированных API

1. Сложность настройки
   Инструменты вроде GraphQL требуют предварительной настройки схем.
2. Привязка к языку
   Например, tRPC работает только с TypeScript.
3. Оверхед
   GraphQL добавляет слои (схемы, резольверы), что усложняет архитектуру.

tRPC: минимум конфигурации, максимум типов

tRPC это библиотека для создания типизированных API без генерации кода. Идеально подходит для монорепозиториев, где фронтенд и бэкенд написаны на TypeScript.

Пример tRPC API

1. Установка:

npm install @trpc/server @trpc/client

2. Создание процедуры (сервер):

// server.ts  
import { initTRPC } from '@trpc/server';  

const t = initTRPC.create();  

const appRouter = t.router({  
  getUser: t.procedure  
    .input((val: unknown) => {  
      if (typeof val === 'string') return val;  
      throw new Error('Invalid input');  
    })  
    .query((req) => {  
      return { id: req.input, name: 'Максим' };  
    }),  
});

3. Клиентский вызов:

// client.ts  
import { createTRPCProxyClient, httpBatchLink } from '@trpc/client';  
import type { AppRouter } from './server';  

const client = createTRPCProxyClient<AppRouter>({  
  links: [httpBatchLink({ url: 'http://localhost:3000/trpc' })],  
});  

const user = await client.getUser.query('123');  
console.log(user); // { id: '123', name: 'Максим' }  

Плюсы tRPC

• Нет лишних запросов — клиент вызывает методы напрямую.
• Простая интеграция — не нужно писать схемы вручную.
• Мгновенная синхронизация типов — изменения на сервере сразу доступны клиенту.

Минусы tRPC

• Только TypeScript — не подходит для мультиязычных проектов.
• Нет встроенного кэширования — в отличие от Apollo Client.

GraphQL: гибкость и независимость клиентов

GraphQL это язык запросов и среда выполнения. Он позволяет клиентам запрашивать только нужные данные, но требует настройки схем и резольверов.

Пример GraphQL API

1. Установка:

npm install graphql @apollo/server

2. Создание схемы (сервер):

// server.ts  
import { ApolloServer } from '@apollo/server';  
import { startStandaloneServer } from '@apollo/server/standalone';  

const typeDefs = `  
  type User {  
    id: ID!  
    name: String!  
  }  

  type Query {  
    getUser(id: ID!): User  
  }  
`;  

const resolvers = {  
  Query: {  
    getUser: (_, { id }) => ({ id, name: 'Максим' }),  
  },  
};  

const server = new ApolloServer({ typeDefs, resolvers });  
const { url } = await startStandaloneServer(server, { listen: { port: 4000 } });

3. Клиентский запрос:

query GetUser($id: ID!) {  
  getUser(id: $id) {  
    id  
    name  
  }  
}

Плюсы GraphQL

• Гибкие запросы — клиент сам выбирает поля.
• Мультиязычность — поддержка любых языков через кодогенерацию.
• Инструменты аналитики — Apollo Studio, GraphiQL.

Минусы GraphQL

• Оверхед — даже простые запросы требуют парсинга.
• Сложность кэширования — нужно настраивать нормализацию данных.

Сравниние tRPC и GraphQL

Когда что выбрать?

Выберите tRPC, если:

• Проект использует TypeScript на всех уровнях.
• Нужно быстро запустить API без лишней конфигурации.
• Клиент и сервер находятся в одном репозитории.

Выберите GraphQL, если:

• В проекте несколько клиентов (мобильное приложение, веб, IoT).
• Требуется гибкость в запросах данных.
• Команда готова инвестировать время в настройку схем.

И tRPC и GraphQL решают проблему типизации API, но подходят для разных задач. В моей практике tRPC отлично зарекомендовал себя в стартапах с быстрым циклом разработки, а GraphQL в крупных проектах с разнородными клиентами.

Попробуйте оба подхода в пет-проектах, чтобы понять их философию. А какое решение предпочитаете вы? Делитесь в комментариях.