반응형 리플로우1 리플로우를 줄이는 CSS작성 1. 브라우저 렌더링 렌더링 엔진 : DOM 트리, CSSOM 트리를 해석하여 렌더트리 생성 이 과정에서 렌더링이 일어난다. html을 파싱하여 dom tree 생성, css 파싱하여 cssom tree 생성 Layout (Reflow) : 배치가 조금이라도 바뀌면 발생한다. 배치가 바뀌지 않으면 생략 Paint (Repaint) : 그리기 - 이 과정은 피할 수 없음 DOM 변경하면?? Render Tree를 변화시킨다. -> reflow가 일어나면 결과적으로 추가 렌더링 Repaint : 한 요소의 속성값에 변화가 있지만 전체 레이아웃에는 영향이 없을 때 visibility, outline, background-color 등 Repaint 과정에서 문서내 DOM Tree의 다른 노드들의 속성도 검증 .. 2022. 3. 6. 이전 1 다음 반응형