react-native list 성능 최적화

list의 성능 최적화는

 

플랫폼형태의 앱 개발에서 매우 중요하나 이슈이다.

 

따라서, 꼭 해야할 성능최적화와 관련된 옵션들을 기록해둔다.

 

1. flatlist를 쓸 것

- flatlist는 react-native 진영에서 가장 최적화가 잘 된 리스트이다.

- 단순히 긴 화면이라면 scrollview를 써야하지만, item이 반복되는 경우라면 반드시 flatlist를 쓰자. 

- 특히, array의 map함수를 쓰는일은 없도록 하자.

 

2. removeClippedSubviews 

- 화면에서 벗어나 item을 unmount하여 메모리를 아껴주는 소중한 옵션이다.

- 사용하겠다고 true로 설정해주자.

 

3. initialNumToRender

- 최초의 몇개의  item을 몇개  render 할지에 대한 옵션이다.

- 컴퓨터도 마음의 준비를 할 수 있게 가능하면 설정해주자

-  number를 값으로 받는다.

 

4. legacyImplementation

- 리스트의 내부적으로 가상화 리스트를 사용할지, 리스트뷰를 할지를 정하는 옵션이다.

- 새것이 좋은것. 가상화 뷰를 사용하자. 그러기위해서는 값을  true로 설정하면 된다.

 

5. 그 외

- 각 item(Component)들의 크기를 최소화하자.

- 복잡한 item(Component)는 작성하는 우리도 힘들지만 컴퓨터도 힘들어한다.

 

 

 

---

웹사이트 개발 / 홈페이지 제작 / android앱 개발 / ios 앱 개발 / server / client / aws / fullstack / buisness partner / 외주 / 용역

https://open.kakao.com/o/sNETgUJb

http://self-made.cloud