kunkunwoo@blog:~$ 거누권의 생각깜지

RCTView, RCTText를 직접적으로 사용하면 더 빠르다?

· 배운 것 · 4분 읽기

오늘 점심에 재미있는 실험에 대한 아티클을 읽었는데, 공유차원에서 올린다. 자세한 내용은 직접 보는것이 좋다.
https://blog.theodo.com/2023/10/native-views-rn-performance/

Using RCTView & RCTText in React Native for Performance Gains | Theodo


이 아티클에 따르면 RCTView, RCTText를 직접 사용했을때 기존에 사용하는 react native의 View, Text 컴포넌트를 사용할때보다 꽤나 차이가 있다고 한다. (물론 극단적인 경우임, 오히려 생각보다 bridge와 fabric의 랜더 퍼포먼스 차이가 없어서 의아하긴 했음.)

그래서 한번 RCTView와 우리가 사용하는 View에 얼마만큼의 뎁스가 있길래 차이가 날까? 생각하며 한번 코드를 보았다.

https://github.com/facebook/react-native/blob/main/packages/react-native/Libraries/Components/View/View.js

react-native/packages/react-native/Libraries/Components/View/View.js at main · facebook/react-native

확인해봤을때 View와 Natvie View Component와의 차이는 1 depth다. 그리고 코드를 봤을때 뭔가의 추가적인 처리가 많은거 같진 않다.
Text는 저위의 아티클에서도 쓰여있듯이 아래 내용외에는 View와 비슷함. ㅋㅋ

In the Text element, an onPress prop is added, which isn’t commonly used (since you’d use a Pressable or TouchableOpacity).

https://github.com/facebook/react-native/blob/main/packages/react-native/Libraries/Text/Text.js

react-native/packages/react-native/Libraries/Text/Text.js at main · facebook/react-native


해당 내용은 아 이런게 있구나~ 정도로 재미로만 보면 좋을것 같다.

그리고 초반에 react native render 테스트에 대한 정확한 방법을 언급하는데, 이게 꽤나 맛도리 글이므로 한번 읽어봐도 좋아보인다.
https://github.com/react-native-community/RNNewArchitectureApp/tree/new-architecture-benchmarks

GitHub - react-native-community/RNNewArchitectureApp: A collection of sample React Native Apps that will show you how to use the