React-Native

[React-Native] ScrollView와 FlatList 중 어떤 것을 쓰는게 좋을까?

leejin_rho 2024. 6. 21. 14:30

리액트 네이티브에는 리액트와 다르게 'ScrollView'와 'FlatList'라는 것이 있다.

 

 

리액트에서는 단순히

{ overflow : auto }

 

를 사용해주면 되는 일이지만, 리액트 네이티브에서는 react-native의 라이브러리를 이용해 구현한다.

 

 

ScrollViewFlatList는 기본적으로는 같은 기능을 한다.

 

하지만 ScrollView는 한번에 스크롤되는 모든 요소가 렌더링되는 반면, FlatList는 스크롤을 내리기 전, 현재 화면에서 렌더링이 될 요소만 렌더링을 하기 때문에 프로그램 성능에 더 긍정적인 영향을 줄 수 있다.

 

따라서 ScrollView보다는 FlatList를 사용하는 것이 더 바람직하다.

 

 

 

 

 

< 공식 문서 참고 ! >

 

ScrollView · React Native

Component that wraps platform ScrollView while providing integration with touch locking "responder" system.

reactnative.dev

 

FlatList · React Native

A performant interface for rendering basic, flat lists, supporting the most handy features:

reactnative.dev