콘텐츠로 이동

Vercel AI SDK

제품에서 LLM을 쓸 때 가장 번거로운 일은 모델마다 API가 제각각이라는 점이에요. OpenAI는 채팅 완성 형식, Anthropic은 별도의 형식, 스트리밍 방식도 벤더마다 다르죠. 이걸 제품 코드에 벤더별로 다 구현하면, 모델을 바꿀 때마다 그 분기 코드까지 다 손봐야 합니다.

Vercel AI SDK는 그 공통 접점을 만들어 주는 TypeScript용 LLM 통합 툴킷입니다. 여러 모델 공급자를 하나의 인터페이스로 맞춰주고, 스트리밍·도구 호출·구조화 출력을 같은 방식으로 다루게 해줘요. 우리는 이 SDK를 기반으로 해서 벤더별 차이를 숨기고, 제품 로직은 벤더와 무관하게 유지합니다.

핵심 개념

하나의 인터페이스로 여러 공급자 다루기

AI SDK는 모델별 어댑터를 두고, 애플리케이션은 generateText·streamText 같은 공통 함수만 호출합니다. 실제 모델은 공급자와 모델 이름으로 지정되며, Claude·GPT-4o·Gemini가 같은 코드 안에서 교체될 수 있어요. 모델이 바뀌어도 호출 코드는 거의 그대로입니다. 이건 "모델을 바꿀 때마다 제품 코드를 고치는" 문제를 애초에 막아주는 설계예요.

스트리밍 UI

LLM 답변은 한 번에 오지 않고 토큰 단위로 도착해요. AI SDK의 streamText는 그 스트리밍을 서버에서 다루고, 프론트엔드의 useChat 같은 훅이 도착하는 텍스트를 받아 타이핑처럼 부드럽게 렌더링합니다. 사용자에게 "기다리는 시간"이 아니라 "채워지는 화면"을 보여주는 것이죠.

구조화 출력과 도구 호출

모델이 자유 텍스트만 내는 게 아니라, 정해진 형태의 데이터(JSON 등)나 도구 호출까지 하게 만들 수 있어요. 캔버스가 다이어그램 요소를 배치하거나, 뉴런이 실제 행동을 고를 때 이 기능을 씁니다.

이 SDK를 쓰면 반복되는 "스트리밍을 어떻게 다루고, 도구 결과를 어떻게 돌려줄지" 같은 공통 문제를 매번 새로 구현하지 않아도 돼요. 벤더별로 달랐던 부분을 SDK가 한 곳에 모아 정리해준다는 점이 가장 큰 장점이에요.

사용 사례 / 실제 적용

  • 멀티벤더 통합 — 잡히는 모델 공급자(Claude·GPT-4o·Gemini)를 AI SDK 위에서 동일하게 다룹니다. 벤더가 달라도 제품 코드는 그대로예요.
  • 스트리밍 응답 UI — 캔버스·웹빌더처럼 생성 결과를 보여주는 곳에서 스트리밍으로 답변을 흘려보내, 응답이 오길 기다리는 느낌을 줄입니다.
  • LLM 추상화 계층의 바탕 — AI SDK가 벤더별 차이를 정리해주므로, 그 위에 우리의 LLM 추상화 계층이 모델 선택·디스패치·폴백 로직을 얹는 구조입니다.

하위 챕터

더 알아보기