인프런 커뮤니티 질문&답변
작성한 질문수
렌더 트리, 렌더 레이어와 그래픽 레이어
해결된 질문
작성
·
25
답변 2
0
안녕하세요 ㅎㅎ
조금은 틀린데요. 이렇게 보시면 될 거 같습니다.
DOM + CSSOM
↓
Render Tree (렌더 객체들)
↓
Render Layers (일부 렌더 객체만 생성)
↓
Graphics Layers (일부 렌더 레이어만 그래픽레이어로 승격)
↓
해당 레이어에 관해 GPU Compositing
렌더 객체가 기본적으로는 렌더 레이어가 되지만, 일부(GPU에서 처리되는 30개 미만 정도)는 그래픽 레이어가 되는 걸로 이해하면 맞는 걸까요?
->
그래픽레이어가 무조건 30개 미만까지만 생성되는 것은 아닙니다. 수백개도 생성이 가능합니다.
정도라는 기준은 없습니다.
또 질문 있으시면 언제든지 질문 부탁드립니다.
좋은 수강평과 별점 5점은 제게 큰 힘이 됩니다. :)
감사합니다.
강사 큰돌 올림.
0
안녕하세요, 인프런 AI 인턴입니다. Golden님 문의 주셔서 감사합니다!
렌더링 엔진에서 사용되는 용어들, 특히 렌더 트리와 렌더 레이어, 그래픽 레이어는 다소 복잡한 개념이지만, 쉽게 설명드리겠습니다.
렌더 트리는 DOM 트리로부터 생성되며, 화면에 실제로 표시되는 요소들로 구성됩니다. 여기서 각각의 요소는 렌더 객체(Render Object)라고 불리며, 이들이 모여 렌더 트리를 형성합니다.
렌더 레이어(Render Layer)는 렌더 객체들의 속성에 따라 구성된 여러 레이어 중 하나입니다. 일반적으로 display나 opacity와 같은 스타일 속성에 따라 각 렌더 객체는 특정 렌더 레이어에 배정됩니다.
그래픽 레이어(Graphics Layer)는 하드웨어 가속 처리를 위해 사용됩니다. 렌더링이 고성능으로 진행되기 위해 GPU가 사용되며, 브라우저의 렌더링 엔진이 일부 렌더 객체들을 그래픽 레이어로 이동시켜 하드웨어 가속을 통해 렌더링합니다. 이러한 처리로 브라우저는 보다 효율적으로 화면을 그릴 수 있습니다.
결론적으로, 렌더 객체가 모두 렌더 레이어로 간다고 볼 수는 없으며, 그래픽 레이어는 최적의 성능을 위해 GPU 처리가 필요한 경우에 사용됩니다. 이는 GPU에 의해 처리 가능한 레이어가 30개 미만으로 제한될 수 있으며, 이 제한 내에서 그래픽 레이어가 생성됩니다.
보다 심도 있는 답변을 원하신다면, 다음과 같은 기존 질문 및 답변이 도움이 될 수 있습니다:
- 브라우저 렌더링 부분 교재 관련 질문입니다!: 이 질문에서 브라우저 렌더링의 세분화된 구조와 사용에 대한 깊이 있는 논의가 진행되었습니다.
저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해 드리고 있습니다. 현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏 추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.