[REACT] React-virtualized | 화면에 보일 때만 렌더링 하기

모든 화면이나, 특히 리스트의 경우 실제 데이터와 화면에 나타날 수 있는 데이터가 다르다.

 

데이터가 10,000개가 있다고 해도 화면에 보이는건 10개이고, 스크롤을 해서 내려야만 나머지 9,990개를 볼 수 있다.

 

따라서 이런 불필요한 렌더링을 방지하기 위해 쓰는것이 react-virtualized 라이브러리다.

 

전체 크기, 전체 높이, 항목 개수, 항목 높이 등을 설정해주어야 하는 불편함이 있다.