Show GN: react-native-pure-chart 2.0.0 - SVG/Skia 없이 View만으로 차트 그리는 라이브러리, 9년 만에 AI 에이...

5 days ago 17

9년 전에 만들었던 React Native 차트 라이브러리를 9년 만에 2.0.0으로 업데이트해서 npm에 올렸습니다. 이번 업데이트 작업의 대부분은 AI 에이전트가 수행했고, 그 과정을 공유합니다. 먼저 라이브러리 소개입니다. react-native-pure-chart는 이름 그대로 "pure"가 정체성입니다. react-native-svg도, ART도, 요즘 표준이 된 Skia도 쓰지 않고 RN의 순수 View/Text 컴포넌트만으로 라인/바/파이 차트를 그립니다. 렌더링 원리는 이렇습니다. 두 데이터 포인트 사이의 거리와 각도를 삼각함수로 계산해서, 가늘고 긴 View를 rotate transform으로 회전시켜 선분처럼 보이게 하고, 이런 조각들을 이어붙여 차트 전체를 구성합니다. 네이티브 드로잉 라이브러리를 link하거나 pod install 과정에서 빌드가 깨질 걱정 없이 npm install 한 줄로 사용할 수 있는 것, 즉 의존성 제로가 핵심 가치입니다. 피크 시절 npm 주간 2,000 다운로드, 약 820개 프로젝트에서 사용됐고 star는 289개였습니다. 이후 9년간 방치됐고, 최신 RN에서 동작하는지도 알 수 없는 상태였습니다. 마침 곧 한도가 초기화되는 AI 계정이 하나 남아 있어서, 점심시간에 프롬프트 하나를 남겨두었습니다. "git clone 해뒀는데 최신 expo/RN 환경에서 잘 돌아가게 해. 하네스 문서 참고" 여기서 "하네스"는 미리 세팅해둔 자가검증 환경입니다. Maestro 같은 모바일 e2e 도구로 iOS 시뮬레이터와 안드로이드 에뮬레이터를 직접 조작하고, 스크린샷을 찍어 렌더링 결과를 확인할 수 있게 해둔 구성입니다. 이번 작업의 핵심이 여기에 있습니다. 9년 전 RN 코드베이스를 최신 expo/RN에서 동작시키려면 손댈 곳이 많습니다. 당시의 컴포넌트 작성 방식과 API가 그대로 남아 있어서 단순 버전업이 아니라 사실상 현대화 리팩토링이 필요한 상태였습니다. 이런 작업은 각각의 난이도는 높지 않지만 양이 많고, 하나 고칠 때마다 실제 화면에서 깨지는 부분이 없는지 확인해야 해서 사람이 직접 하면 상당한 시간이 드는 종류입니다. 제가 다른 일을 하는 동안 에이전트는 몇 시간 동안 혼자 루프를 돌았습니다. 코드를 수정하고, 시뮬레이터와 에뮬레이터에서 앱을 구동하고, e2e로 화면을 조작한 뒤 스크린샷을 찍고, 그 스크린샷을 보고 렌더링 문제를 판정한 다음 다시 코드를 수정...

Read Entire Article