[React Native] react-native-reanimated 란?

👉 react-native-reanimated 란?

빠르고 부드러운 애니메이션을 만들어주는 React Native 라이브러리

 

특징

React Native 메인 스레드가 아닌,  UI 스레드에서 실행된다.

 

원리

React Native에서, app 코드는 메인 스레드 외부(UI스레드)에서 실행된다.
- js가 할일이 많은 경우 프레임 드롭 방지
- 터치에 대한 즉각적인 반응 불가능 ( 메인스레드에서 수행된 사항을, 바로바로 반영할 수 없다. )

가상머신을 사용해, UI스레드에서 동기적으로 실행할 수 있는 작은 JS코드인 "Worklet"을 만들어 사용한다.

메인 스레드에 가해지는 로드에 대해 신경쓰지 않아도 된다.
이벤트가 발생할때, 터치 이벤트에 즉시 응답하고 동일한 프레임 내에서 UI를 업데이트 할 수 있다.