Viem - web3 라이브러리

WalletConnect V1이 6월 28일 오후 2시 (UTC 기준) 부터 서비스 종료 예정으로 그 이전에 V2 버전으로 마이그레이션을 작업을 진행해야 되는 상황이 발생하게 됬습니다. 관련하여 작업을 진행하다 보니 Viem 이라는 라이브러리를 사용하게 되어 간단하게 설명 및 정리를 하고자 합니다.
Viem은 web3 dapp을 쉽고 빠르게 구축 할 수 있도록 도와주는 wagmi 개발팀에서 만든 typescript 라이브러리 입니다.
가볍고 사용하기 쉽다는 특징을 가지고 있으며 비록 ethers.js와 web3.js 와 비교 했을때 새로 나온 라이브러리지만 여러가지 더 좋은 장점을 가지고 있습니다.
TypeScript 지원:
Viem은 typescript로 작성되었기 때문에 ether.js와 web3.js 보다 type safe 합니다. 이러한 장점은 에러 발생 방지 그리고 코드를 좀 더 읽기 쉽게 만들어 줍니다.
간결한 API:
제공하는 api가 web3.js와 ethers.js보다 간결하고 쉬어 입문자도 쉽게 사용 할 수 있습니다.
번들 크기:
viem의 번들 사이즈는 35kb 밖에 되지 않는다고 하며 tree-shaking 또한 지원을 한다고 합니다.
notion image
성능:
viem은 필요할 경우에만 무거운 비동기 작업 실행 그리고 encoding/parsing 알고리즘 최적화를 통해 성능을 조정 합니다. 아래는 이미지는 몇 가지 함수 실행에 대한 밴치마크 결과 입니다.
notion image
notion image
notion image

Viem 사용해보기

패키지 설치
 
viem에는 client라는 개념을 사용하는데 블록체인 연동에 사용하는 ethers.js의 provider 와 비슷한 역할을 수행합니다.
  • PublicClient: getBlockNumber , getBalance 같은 public action(데이터 읽기)에 접근할 수 있도록 해줍니다.
  • WalletClient: sendTransaction , signMessage 같은 wallet action(데이터 쓰기)에 접근할 수 있도록 해줍니다.
client 생성
 
client 셋팅이 완료 됬으니 이제 배포된 스마트컨트랙트의 abi의 데이터 읽어오는 방법 그리고 상호작용하는 방법에 대해서 알아보자. 저의 경우 polygon mumbai에 배포한 컨트랙트를 활용하였습니다.
전체코드는 경우 repo링크 를 통해 확인 할 수 있습니다.
abi 데이터 읽기
abi 데이터 쓰기
위에서 작성한 방법 처럼 contract 객체를 생성하여 ABI 함수를 호출 할 수 있지만 readContract , writeContract 를 활용하는 방법 또한 있으니 문서를 참고하면 좋을거 같습니다.
만약 web3.js와 ethers.js 말고 다른 라이브러리를 찾고 계신다면 좋은 대안될거 같다고 생각이 됩니다.

참고

© 2024 dan.dev.log, All right reserved.

Built with NextJS