240111 TIL

<기술면접질문>

• 데이터 10,000개를 가지고 무한 스크롤 구현시에 가장 중요하게 고려해야 할점은 무엇인가요?
  데이터를 분할하여 불러올 때마다 reflow 발생으로 개수가 많아질수록 렌더링 속도가 점점 느려집니다. 그렇기에 눈에 보이는 UI외의 아이템을 어떻게 처리할지 고려를 해야합니다 리플로우를 방지하는 Intersection Observer 등을 이용할 수 있습니다.
  리플로우(reflow): 리플로우는 문서 내 요소의 위치와 도형을 다시 계산하기 위한 웹브라우저 프로세스의 이름으로, 문서의 일부 또는 전체를 다시 렌더링하는 데 사용됩니다.

• Javascript의 호이스팅에 대해 설명해주세요.
  자바스크립트 호이스팅은 인터프리터가 코드를 실행하기 전에 변수선언, 함수선언이 해당 스코프의 최상단으로 끌어올려진 것 같은 현상을 말합니다. 자바스크립트 엔진은 코드를 실행하기 전, 실행컨텍스트를 위한 과정에서 모든 선언을 스코프에 등록합니다. 실행 가능한 코드를 형상화하고 구분하며, 코드 실행 전에 변수선언 및 함수선언을 저장해 선언문보다 참조, 호출이 먼저 나와도 오류없이 동작합니다.
  실행컨텍스트: 실행 컨텍스트는 실행할 코드에 제공할 환경정보들을 모아놓은 객체입니다.
즉, 실행 가능한 코드가 실행되기 위해 필요한 환경을 의미합니다. 자바스크립트는 동일한 환경에 있는 환경 정보들을 모은 실행 컨텍스트를 콜스택에 쌓아올린 후 실행하여 코드의 환경과 순서를 보장할 수 있게 됩니다.