Virtual Scroll

Virtual Scroll은 직역한 것과 같이 가상의 스크롤을 뜻한다.

 

이러한 Virtual Scroll이 필요한 이유는 브라우저 상에 랜더링된 DOM의 개수가 많아지면 스크롤할 때 느려지는 등의 사용성 문제가 발생하는 것을 방지하기 위한 방법이다.

 

위와 같은 문제가 발생하게 되는 이유는 스크롤을 내릴 때마다 새로운 아이템을 불러오고 불러온 아이템을 브라우저에 모두 랜더링하게 되면서 랜더링된 DOM의 개수가 계속해서 쌓이기 때문이다.

 

이때 Virtual Scroll은 브라우저에서 스크롤할 때 보일 정도로만 DOM의 수를 유지하여 위에서 발생하는 느려지는 등의 문제가 발생하지 않도록 한다.

 

DOM의 개수를 유지하는 기본적인 원리는 스크롤된 위치와 DOM이 보여야 하는 공간의 높이 그리고 DOM 각각의 높이 등을 계산하여 보이지 않게 되는 DOM은 삭제하고 보여야 하는 DOM은 추가하면 된다.