더티비트1

• 

  [브라우저] 배치(Layout), Paint(feat 더티비트) ◆ 브라우저 렌더링 순서 * Render Tree : 화면에 표시되어야 할 모든 노드의 컨텐츠, 스타일 정보를 포함하는 트리.(display none 이나 meta정보는 포함되지 않음) * 박스모델..(Block , Inline Block, InLine...) ■ 배치 = Layout = Reflow라 불린다. Render Tree에는 보여줄 수 있는 모든 정보가 있다. 이를 실제로 화면에 보여주기 위해서 요소들의 정확한 위치와 크기를 계산하는 과정이다. 화면에서 차지하는 영역, 여백, 스타일 속성이 계산된다. ( %, em 같은 상대적인 단위는 px단위로 변환됨) 이 과정을 통해서 렌더링엔진은 각 요소가 어떻게 생겼고, 어디에 보여줄 지 알게 된다. 구체적으로는 왼쪽에서 오른쪽으로, 위에서 아래로 배치.. 브라우저 2023. 2. 27.