react-native 0.72 버전 업데이트 사항(번역)

Symlink 지원, 에러 개선 등

 

이번 릴리즈는 Metro와 에러 핸들링 개선 및 개발 경험 향상과 관련해서 많이 요청된 기능이 더해졌다. 이번 태스크의 대부분은 2022 커뮤니티 설문조사 응답을 반여했다. 설문에 참여해준 모든 분께 감사하다.

 

주요 변경사항

- 메트로의 새로운 기능

- 개발자 경험 향상

- 새로운 아키텍쳐 적용

 

유의 변경사항

- 더 이상 지원하지 않는 컴포넌트 제거

- 패키지 이름 변경

 

 주요 변경사항 

메트로의 새로운 기능

Symlink 지원 (베타 버전)

Symlink 지원은 계속해서 메트로에서 가장 많이 요청되는 기능 중 하나이다. (...)

Symlink 지원은 RN이 monorepo 설정과 pnpm과 밀접하게 동작할 수 있도록 해준다.

(...) 우리는 0.73 버전에서 symlink 기능이 기본으로 탑재될 수 있도록 계획하고 있다.

 

패키지 export 지원 (베타 버전)

패키지 export는 package.json "main" 필드를 대체하는 최신 문법이다. 그리고 npm 패키지가 공용 API를 정의하고 RN을 타겟팅할 수 있는 새로운 기능을 제공한다.

Metro 설정에서 패키지 Export 지원을 할 수 있도록 하면 당신의 앱은 새로운 "react-native" 커뮤니티 조건을 포함해 더 넓은 JS 생태계와 호환될 것이다.

 

베타기능 가능여부 설정

위 2가지 베타 기능 가능여부를 metro.config.js 에서 설정하면 된다. (홈페이지에 코드 있음)

 

새로운 metro.config.js 설정

RN 0.72 버전에서 RN CLI setup을 컨트롤하는 설정을 변경했다. 템플릿 버전을 맞추기 위해 metro.config.js 파일을 업데이트 해야 한다.

이것은 프로젝트의 기본 RN Metro 설정을 확장하는 것에 대한 컨트롤 키를 이동시킨다. 그리고 남은 기본값을 제거했다. 더하여 'metro get-dependencies' 같은  Metro CLI 독립 커맨드가 이제 동작할 것이다.

 

 

개발자 경험 향상

 

부적합한 style 속성에 red box가 보이지 않음

전에는 StyleSheet에 부적합한 style 속성을 제공하면 redbox에 결과가 나왔다. 이것은 높은 수준의 에러 경고를 나타냅니다. 이것은 높은 신호 오류인데요. 상대적으로 위험성이 낮은 에러에 대해 개발자 워크플로우를 방해합니다.

0.72에서 부적합한 css 속성을 제공하는 것 같은 실패에 대해 조용히 표시하도록 기대치를 낮췄습니다. 그리고 빌드타임이나 런타임에 잡히는 몇몇 에러 타입을 업데이트했습니다.

 

Hermes 에러 가독성 개선

Hermes는 undefined 콜러를 호출할 때 더 나은 에러 메세지를 추가했다.

// Before: undefined is not a function
// After: x is not a function (it is undefined)

추가로 로그박스는 현재 앱 유저와 관련 없는 Hermes 바이트코드 프레임을 필터링한다.

 

RN CLI 에러 아웃풋 향상

0.72는 RN CLI v11과 함께 출시됩니다. v11은 중복 감소, 워딩을 명확하게 변경한 것, 스택 추적 감소, 그리고 init, run-android, run-ios 커맨드에 관련 문서에 대한 딥링크를 추가한 것 등의 개선 사항이 포함됩니다.

RN CLI 체인지 로그 확인해 보자.

 

더 빨라진 컴파일 및 Hermes JSON 파싱 속도

Hermes는 큰 사이즈의 객체 리터럴에 대해 컴파일하는 속도를 향상했다. (...) Herme 사용 알고리즘에서 중복 제거 매커니즘을 향상시키면서 컴파일 속도가 97%까지 빨라졌다.

JSON 파싱도 여러 방면에서 최적화됐다. 이는 redux-persist 처럼 JSON에 깊게 의존하는 라이브러리 기능을 향상시킨다.

 

Hermes에서 더 많은 ES문법 지원

- {Array, TypedArray, String}.at

- 올바른 형식의 JSON.stringify 구현

- 여러 오류를 하나의 오류로 묶어 나타내는 AggregateError 구현 (Promise.any() 등 여러 오류가 발생하는 경우 유용)

 

 

새로운 아키텍쳐 업데이트

새로운 아키텍쳐는 현재 실험 단계다. 타겟 오디언스에게 집중된 업데이트를 계속하기 위해서, 0.72에서 새 아키텍쳐 업데이트와 향후 릴리즈들을 전담 그룹으로 이관하고 있다.

 

 

유의 변경사항

 

지원중단된 컴포넌트 제거

- @react-native-community/slider Slider

- @react-native-community/datetimepicker DatePickerIOS

- @react-native-community/progress-view ProgressViewIOS

 

패키지 rename

react-native core 레파지토리 내 모든 패키지가 react-native/package 내부로 이동되었다. 그리고 명확한 소유권을 확실하게 하기 위해서 @react-native라는 npm 스코프 아래에 출시된다.

 

그리고 몇몇 패키지 명칭이 변경된다. (ex. @react-native/polyfills -> @react-native/js-polyfills...) 

rename한 패키지에 대해 직접적인 종속성이 없는 한, 이 변경점은 영향을 미치지 않을 것이다. 한편, 0.72로 업그레이드 하면, 리네임된 디펜던시를 0.72 버전으로 업데이트해라.

 

 

 

 

 

 

 

 

 

 

 

번역 페이지

https://reactnative.dev/blog/2023/06/21/0.72-metro-package-exports-symlinks