AI 시대, React Summit US 2025에서 찾은 프론트엔드 기술의 미래
카카오뱅크 프론트엔드 클랜이 React Summit US 2025에 참여하여 AI 실무 엔지니어링, 리액트 거버넌스 변화 등 최신 기술 동향을 파악함.
Addy Osmani는 AI 코딩의 한계와 엔지니어의 역할 변화를 강조하며, 설계 역량(Architect)의 중요성을 역설함.
React 재단 출범과 React Compiler의 등장으로 리액트 생태계의 변화를 조명하고, AI 시대의 개발 방향성을 제시함.
Rust 기반 툴링(Rolldown, Oxc)을 통해 프론트엔드 개발 환경의 복잡성 감소를 시도하며, 개발 생산성 향상을 모색함.
AI 코딩, 어디까지 왔나: Addy Osmani의 통찰
Addy Osmani는 AI가 코드 생성에 활용될 수 있지만, AI 환각(Hallucination)과 맥락 부족으로 인해 복잡한 애플리케이션에서는 한계를 보인다고 지적했다.
Vibe Coding vs Agentic Engineering: AI를 활용한 엔지니어링은 SDLC(Software Development Life Cycle)에 AI를 통합하여 결과물에 대한 통제권을 확보하는 것을 의미한다.
복잡도 절벽(The Complexity Cliff): AI 모델은 단일 컴포넌트 생성에는 능숙하지만, 기존 코드베이스 통합, 상태 관리, 비즈니스 로직 변경 등에서는 성능이 급격히 저하된다.
엔지니어의 역할 변화: AI에게 명확한 요구사항과 맥락을 제공하고 결과물의 품질을 검수하는 설계자(Architect)의 역할이 중요해짐을 강조했다.
React 생태계의 변화: 재단 출범과 컴파일러의 등장
React Summit US 2025에서는 React 재단 출범과 React Compiler의 등장을 통해 리액트 생태계의 변화를 조명했다.
React 재단: Meta 내부에서 주도하던 의사결정을 외부로 공개하고, 핵심 라이브러리 기여자 지원 및 오픈소스 진입 장벽을 낮추는 역할을 수행한다.
React Compiler: 단순 자동 메모이제이션 도구를 넘어, 개발자가 성능 최적화에서 벗어나 비즈니스 로직에 집중할 수 있도록 렌더링 모델의 패러다임 변화를 이끌 것이다.
AI 시대의 가이드라인: 프레임워크 작성자는 AI 모델이 올바른 코드를 생성할 수 있도록 지침과 평가 기준을 명확히 제공해야 한다.
프론트엔드 파편화의 종말: Rust 기반 툴링
Alexander Lichter는 Rust 기반의 통합 툴링을 통해 프론트엔드 개발의 고질적인 문제인 도구 선택의 피로(Decision Fatigue)를 해결하고자 했다.
문제의 핵심: 개발(Dev)과 프로덕션(Prod) 환경의 빌드 도구 이원화로 인한 복잡성 증가와 버그 발생
Rolldown: Vite 팀이 주도하는 Rolldown은 esbuild만큼 빠르면서도 Rollup의 API와 플러그인 생태계를 호환하여 개발과 배포 환경의 번들러를 통합한다.
Oxc: Rolldown을 뒷받침하는 고성능 툴킷으로, ESLint 대비 50~100배 빠른 Linting 속도와 독자적인 Parser를 제공하여 대규모 프로젝트의 DX(Developer Experience)를 개선한다.
바이브 코딩, AI와 엔지니어의 협업
Ken Wheeler는 AI를 활용한 바이브 코딩(Vibe Coding)이 개발의 본질과 다르지 않으며, 엔지니어의 역할 변화를 강조했다.
바이브 코딩의 재정의: 과거 개발자들이 구글과 Stack Overflow를 활용해 코드를 조합하던 과정과 유사하며, AI는 리서치와 타이핑을 돕는 도구일 뿐이다.
실패하지 않는 규칙: AI의 AI 환각(Hallucination)을 인지하고, 도메인 지식과 코드 검증 책임을 다해야 한다.
결정론(Determinism) 확보: AI가 특정 기능을 확실하게 호출하도록 잘 만들어진 도구(Function Calling/Tools)를 제공하여 결과의 예측 가능성을 확보해야 한다.
DX와 UX의 균형: RSC의 재조명
Amy Dutton은 RSC(React Server Components)가 DX(Developer Experience)를 희생한다는 오해를 반박하며, 웹 표준으로의 회귀이자 합리적 진화임을 강조했다.
RSC의 본질: 앱의 무게중심을 클라이언트에서 서버로 옮기는 것은 웹 표준을 따르는 것이며, 이는 성능 향상과 개발 편의성을 동시에 추구하는 것이다.
초기 생태계의 부족함: RSC의 초기 생태계는 부족한 부분이 있었지만, 지속적인 발전을 통해 DX와 UX의 균형을 맞춰나갈 것이다.
AI와 디자인 시스템의 결합: Figma 디자인을 프로덕션 레벨의 코드로 변환하는 워크플로우를 통해 엔지니어가 단순 구현을 넘어 프로덕트를 만들어내는 빌더(Builder)로 진화할 수 있다.
