서버 0대, 브라우저 SLM으로 만든 차트 추천 봇
Summary
"서버는 0대, 내 브라우저 속 AI가 차트를 추천해 드립니다"
Transformers.js와 규칙 엔진의 조화로 구현한 저비용·고보안 온디바이스 AI 개발기
본 아티클은 클라우드 서버 없이 사용자의 브라우저 자원만으로 동작하는 차트 추천 봇의 구현 과정을 다룹니다. 프라이버시 보호와 비용 절감을 위해 온디바이스 SLM을 채택하고, 생성형 AI의 환각 증상을 제어하기 위해 규칙 기반 시스템과 협업하는 실전적인 아키텍처를 제시합니다.
- 01서버 인프라와 API 비용을 완전히 제거한 혁신적인 브라우저 기반 SLM 아키텍처
- 02WebGPU 지원 및 WASM 폴백 전략을 통한 안정적인 크로스 브라우저 호환성 확보
- 03판단은 규칙 엔진이, 설명은 SLM이 담당하는 구조로 AI의 신뢰성과 유연성을 동시 해결
- 04UI 응답성 유지를 위해 Web Worker 내에서 비동기적으로 모델 로드 및 추론 실행
- 05사용자 경험 향상을 위한 스트리밍 출력 및 단계별 로딩 UX 설계 인사이트
RECOMMENDATION
데이터 보안이 중요하거나 운영 비용 부담을 줄이고 싶은 AI 프로젝트 관리자 및 온디바이스 LLM 활용법을 고민하는 프론트엔드 엔지니어에게 추천합니다.
The Problem
사용자가 스프레드시트 데이터를 시각화할 때 적절한 차트 유형을 선택하는 데 어려움을 겪으며, 서버 기반 LLM 방식은 데이터 프라이버시 침해, 높은 API 비용, 네트워크 지연 시간이라는 명확한 한계를 가집니다.
The Solution
Transformers.js 라이브러리를 활용해 브라우저 내에서 직접 SLM을 구동하고, 결정론적인 '규칙 엔진'이 차트 종류를 판정하면 SLM이 그 이유를 한국어 자연어로 설명하도록 역할과 책임을 분리하여 설계했습니다.
The Result
서버 인프라 비용 없이 데이터가 기기 밖으로 나가지 않는 보안성을 확보했으며, 차트 추천과 같은 좁은 범위의 태스크에서는 1~3B 파라미터의 소형 모델로도 실용적인 결과를 얻을 수 있음을 입증했습니다.
Trade-off
최초 모델 로딩 시 수백 MB 규모의 데이터를 다운로드해야 하는 대기 시간이 발생하며, 사용자의 하드웨어 사양에 따라 추론 속도 편차가 크고 규칙 엔진이 데이터의 의미적 맥락을 완전히 이해하지 못해 부적절한 차트를 제안할 가능성이 존재합니다.
Key Concepts
More from 미리디
View all posts from 미리디
AI 잘 쓰는 사람의 노하우, 어떻게 팀 전체로 퍼질까?
AI EnablementAXAI Native2일 전미리캔버스가 AI 3대로 해외 트렌드에서 진짜를 가려내는 법
LLM AgentsMulti-Agent OrchestrationTrend Analysis1주 전AI로 QA 업무를 자동화한 방법: n8n부터 E2E 테스트 자동화까지
n8nE2E TestingLLM2주 전통합 검색 임베딩 모델 개발기: 9개 태스크를 고르게 학습시키기
EmbeddingMulti-task LearningContrastive Learning2주 전데이터 요청 응대 30분을 3분으로 줄인 n8n AI 에이전트
n8nAI AgentWorkflow Automation3주 전