5kb 미만 런타임과 WASM 샌드박스로 구현한 Agent-Native UI 프레임워크

Context

복잡한 Build Step과 JSX 컴파일러 중심의 기존 프레임워크는 LLM이 코드를 생성하고 실행하는 Agentic Era의 워크플로우에 높은 진입장벽으로 작용함. 특히 AI가 생성한 신뢰할 수 없는 코드를 안전하게 브라우저에서 실행하기 위한 보안 격리 구조의 부재가 핵심 한계점으로 지적됨.

Technical Solution

• JavaScript Modules, Tagged Template Literals, DOM 등 웹 표준 Primitive 기반 설계로 컴파일러 및 Build Step 제거
• reactive, html, component 3가지 핵심 함수로 인터페이스를 최소화하여 LLM의 Context Window 점유율을 5% 미만으로 최적화
• QuickJS WebAssembly Realm을 활용한 WASM 샌드박스 도입으로 iframe이나 eval 없이 Agent 생성 코드의 안전한 실행 환경 구축
• @arrow-js/framework, @arrow-js/ssr, @arrow-js/hydrate 패키지 분리를 통한 기능별 Layered Architecture 적용
• Dependency-free 구조 설계를 통한 런타임 오버헤드 최소화 및 플랫폼 밀착형 반응성 구현

Impact

• 런타임 크기 5kb 미만 달성으로 네트워크 전송 효율 극대화
• Vue 3와 대등한 수준의 벤치마크 성능 확보
• 200k 토큰 컨텍스트 윈도우의 5% 미만으로 전체 문서 학습 가능

Key Takeaway

추상화 계층을 최소화하고 웹 표준에 밀착한 설계가 인간 개발자뿐 아니라 AI Agent의 코드 생성 및 유지보수 효율을 극대화하는 핵심 전략임.