Critical Rendering Path
·
Web
HTML의 렌더링 과정에 대해서 지난번에 공부한 적이 있다. 간단하게는 다음과 같은 과정을 거치게 된다. 다운로드 : 화면을 그려주는데 필요한 리소스(html, css, js)를 다운로드 한다. HTML 준비 : 렌더링 되어야 할 HTML 요소로 DOM을 만들어 준다. CSS 준비 : css 코드를 가지고 와서 CSSOM을 만들어 준다. 두개 합치기 : 둘을 합쳐서 렌더링 트리를 생성한다. 위치 그리기 : 화면에 요소들이 어디 놓일 지 그려준다. 색칠하기 : 그려친 요소에 색을 칠해준다. 여기서 위치 그리기, Layout 단계가 다시 실행되면 색칠하기, Paint 단계도 다시 실행되는 Reflow는 성능 저하의 주요 원인이 된다.  메모이제이션을 통해 불필요한 기능 재실행을 줄이는 것 외에도, reflo..