Skip to main content

React Native 0.64 발표: iOS에서 Hermes 지원 추가

· 6 min read
Mike Grabowski
Mike Grabowski
CTO and Co-Founder at Callstack

오늘 우리는 iOS에서 Hermes를 지원하는 React Native 0.64를 출시한다.

iOS에서 Hermes 선택적 사용​

Hermes는 React Native 실행을 최적화한 오픈소스 자바스크립트 엔진이다. 메모리 사용량을 줄이고, 다운로드 크기를 줄이며, 앱이 사용 가능해지는 시간(Time to Interactive, TTI)을 단축함으로써 성능을 향상시킨다.

이번 릴리즈에서 iOS에서도 Hermes를 사용해 빌드할 수 있게 되었다는 소식을 전한다. iOS에서 Hermes를 활성화하려면 Podfile에서 hermes_enabled를 true로 설정하고 pod install을 실행하면 된다.

use_react_native!(
   :path => config[:reactNativePath],
   # iOS에서 Hermes를 활성화하려면 `false`를 `true`로 변경하고 pods를 설치한다
   :hermes_enabled => true
)

iOS에서의 Hermes 지원은 아직 초기 단계임을 유의해야 한다. 추가 벤치마킹을 진행 중이므로 선택적으로 사용할 수 있도록 했다. 여러분의 애플리케이션에서 직접 시도해보고 결과를 알려주길 바란다!

기본값으로 활성화된 인라인 요구(Inline Requires)​

인라인 요구는 Metro의 설정 옵션 중 하나로, JavaScript 모듈의 실행을 앱 시작 시점이 아니라 실제 사용 시점으로 지연시켜 시작 시간을 단축한다.

이 기능은 몇 년 전부터 선택적 설정 옵션으로 존재해왔으며, 문서의 성능 섹션에서 추천해왔다. 이제는 새로운 애플리케이션에서 기본값으로 활성화되어, 추가 설정 없이도 빠른 React Native 애플리케이션을 만들 수 있도록 돕는다.

인라인 요구는 Babel 변환 기능으로, 모듈 임포트를 인라인 형태로 변환한다. 예를 들어, 인라인 요구는 파일 상단에 위치한 모듈 임포트를 실제 사용되는 위치로 이동시킨다.

변경 전:

import {MyFunction} from 'my-module';

const MyComponent = props => {
  const result = MyFunction();

  return <Text>{result}</Text>;
};

변경 후:

const MyComponent = props => {
  const result = require('my-module').MyFunction();

  return <Text>{result}</Text>;
};

인라인 요구에 대한 더 자세한 정보는 성능 문서에서 확인할 수 있다.

Chrome에서 Hermes 트레이스 확인하기​

지난 한 해 동안 Facebook은 Major League Hacking fellowship을 후원하며 React Native에 기여할 수 있는 기회를 제공했다. Jessie Nguyen과 Saphal Patro는 Chrome DevTools의 Performance 탭을 사용해 Hermes를 사용 중인 애플리케이션의 실행 과정을 시각화할 수 있는 기능을 추가했다.

자세한 내용은 새로운 문서 페이지를 참고한다.

프록시 지원이 추가된 Hermes​

Hermes에 프록시 지원 기능을 추가해 react-native-firebase와 mobx 같은 인기 커뮤니티 프로젝트와의 호환성을 확보했다. 기존에 이 패키지들을 사용 중이라면 이제 프로젝트에서 Hermes로 마이그레이션할 수 있다.

다가오는 릴리스에서 Hermes를 Android의 기본 자바스크립트 엔진으로 지정할 예정이므로, Hermes 사용 시 남아 있는 문제점들을 해결하기 위해 노력 중이다. 여러분의 앱이 Hermes를 도입하는 데 걸림돌이 되는 문제가 있다면 Hermes GitHub 저장소에 이슈를 등록해 주세요.

React 17​

React 17은 개발자에게 새로운 기능을 추가하거나 주요 변경 사항을 포함하지 않는다. React Native 애플리케이션의 경우, 주요 변경 사항은 새로운 JSX 변환으로, 이제 파일에서 JSX를 사용하기 위해 React를 임포트할 필요가 없어졌다.

React 17에 대한 더 많은 정보는 React 블로그에서 확인할 수 있다.

주요 의존성 버전 변경 사항​

  • Android API 레벨 16-20 지원 중단. Facebook 앱은 사용량이 충분히 낮은 Android 버전에 대한 지원을 지속적으로 중단한다. Facebook 앱이 더 이상 이 버전들을 지원하지 않고, React Native의 주요 테스트 환경이기 때문에 React Native도 지원을 중단한다.
  • Xcode 12와 CocoaPods 1.10이 필수로 요구된다.
  • 최소 Node 지원 버전이 10에서 Node 12로 상향 조정되었다.
  • Flipper 버전이 0.75.1로 업데이트되었다.

감사의 말​

0.64 버전을 만드는 데 도움을 준 수백 명의 기여자들에게 감사드립니다! 0.64 변경 로그에서 이번 릴리스에 포함된 모든 변경 사항을 확인할 수 있습니다.