[React Native] React Native 버전 업그레이드

1. 개요

개인적으로 React Native를 이용해 개발해 운영중인 서비스가 있다.

시간이 지나며 새로운 버전의 React Native가 출시됐는데, 새로운 아키텍쳐를 적용과 개발의 효율성을 높이기 위해 React Native의 버전 업그레이드를 진행하기로 했다.

 

2. 업그레이드를 하게 된 이유

이전 버전의 React Native를 이용해도 서비스의 운영은 충분히 가능하긴 하다.

하지만 아래의 이유로 React Native의 버전을 업그레이드하기로 했다.

1) 아키텍쳐 변경

기존 React Native는 bridge방식을 이용해 cross platform을 구현하고 있었다.

새로운 React Native는 JSI(Javascript Interface)를 이용해 bridge를 대체하고, 네이티브코드에 직접 접근할 수 있게 되었다.

이 방식 덕분에 서비스의 전반적인 속도가 빨라졌다.

 

2) 개발 도구 추가

새로운 버전의 React Native는 React Native DevTools가 도입되어 개발 효율성이 증가했다.

 

3) Metro속도 향상

새로운 Metro Resolver의 도입으로 빌드 속도가 약 15배 빨라졌다.

 

4) 기타

그 외에도 Android번들 크기 감소와 같은 개선 사항이 있다. 더 자세한 내용은 아래 페이지에서 확인할 수 있다.

https://reactnative.dev/blog/2024/10/23/release-0.76-new-architecture#removed-the-dependency-on-the-react-native-communitycli

React Native 0.76 - New Architecture by default, React Native DevTools, and more · React Native

 

3. React Native 버전 업그레이드 하기

React Native에서는 버전 업그레이드를 위한 helper를 지원하고 있다.

https://react-native-community.github.io/upgrade-helper/

Upgrade React Native applications

이곳에서 앱 이름, package, 현재 버전, 업그레이드할 버전을 입력하면 수정해야 할 파일들과 내용이 나온다.

이런식으로 나온다.

지시에 따라 모든 파일들을 수정하면 일단 React Native의 버전 업그레이드는 완료된다.

하지만 이대로 빌드해보면 아마 무수한 에러가 쏟아질 것이다.

 

4. React Native버전 업드레이드 이후 에러 조치

이후에 발생하는 에러는 크게 두가지이다.

1) 이전 버전의 캐시가 남아있는 경우

* Android, iOS의 캐시, 앱을 모두 삭제하고 다시 빌드한다.

 

2) 라이브러리 호환성

이게 제일 큰 문제이다. 특히 이번 버전업그레이드는 주요 아키텍쳐 변경을 포함하고 있기 때문에 더 어려움이 있었다.

아래와 같은 방법으로 해결할 수 있었다.

 

* 모든 라이브러리를 최신 버전으로 업데이트한다. 특히 라이브러리 설치 이후 추가설정 부분에서 변경 사항이 있는 경우가 많다. 이 부분을 주의해서 모든 라이브러리를 업데이트한다.

* cocoapod, watchman이 최신 버전인지 확인한다.

*  iOS의 경우 빌드시 "duplicate symbols" 오류가 발생할 수 있다. 이는 특정 라이브러리에서 발생하는 오류로 빌드 로그를 확인하고, 어떤 라이브러리에서 문제가 발생했는지 확인 후 수정사항이 반영됐는지, 라이브러리 업데이트가 제대로 됐는지 확인한다.

* Android의 경우 .gradle파일과 AndroidManifest파일에 수정사항이 반영됐는지 확인한다. 또 JAVA에서 Kotlin으로 변경된 경우 알맞는 언어로 변경됐는지 확인한다.

 

5. 마무리

버전 업그레이드는 항상 힘든것 같다.

특히 이번 경우는 아키텍쳐의 변경도 포함되어있어 더 어려웠던것 같다.

그리고 React 특성상 오픈소스 라이브러리를 이용하는 경우가 많고 버전업에 따라 발생하는 문제가 제각각이라 검색을 통해서도 적절한 답을 구하지 못하는 경우가 많았다.

혹시모를 경우를 대비해서 업그레이드 전 반드시 백업해두고, 에러 로그를 찬찬히 읽어보며 진행한 덕분에 버전 업그레이드를 성공적으로 할 수 있었던 것 같다.