VoidZero가 최근 선보인 Vite+가 웹3 프론트엔드 빌드 툴체인으로 꽤 주목받고 있네요. 마침 최근 릴리즈된 Wagmi v3와 Next.js 16.3 환경을 엮어서 프론트엔드 최적화를 실험해보고 있는데, 빌드 속도와 번들 크기 면에서 체감이 확실합니다. 특히 Wagmi v3로 넘어오면서 모든 월렛 커넥터가 옵셔널 피어 디펜던시로 완전히 분리되었는데, 이 구조가 Vite+의 트리쉐이킹과 아주 찰떡궁합이네요.

이번 Wagmi v3 마이그레이션에서 눈여겨볼 변화는 프로바이더 메커니즘 정렬입니다. 핵심 훅인 useAccount가 useConnection으로 개편되었고, 서명이나 트랜잭션 전송 같은 상태 변경 액션들이 TanStack Query v5 뮤테이션 패턴으로 통일되어 .mutate() 또는 .mutateAsync() 호출 방식으로 바뀌었습니다. 무거운 기성 UI 라이브러리 대신 직접 useConnection과 useConnect 훅을 엮어 커스텀 연결 UI를 빌드하면 번들 용량을 극적으로 쥐어짤 수 있습니다.

Next.js나 Turbopack 환경에서 피어 디펜던시 누락으로 종종 발생하던 번들링 찌꺼기나 임포트 에러도 Vite+ 레이어에서 깔끔하게 떨어지네요. 초경량 웹3 dApp이나 온체인 에이전트 결제 게이트웨이 화면을 짤 때 이 조합은 꽤 유용한 무기가 될 것 같습니다. 주말에 이 구조로 깃허브 보일러플레이트 리포지토리나 하나 파봐야겠어요 ㅎㅎ