프론트엔드로 가는 길/프론트 용어 꼬리 물기6 DOM 트리 렌더 트리 Q1. 브라우저에서 DOM 트리와 렌더 트리의 차이는 무엇인가요? A. DOM은 html 파일이 파싱되어 생성된 트리입니다. 렌더트리의 경우 DOM과 CSSOM이 결합된 트리를 칭하는 말입니다. 답변에 대한 평가 : 90점 평가 이유 : DOM과 렌더 트리에 대한 개념에 대해 명확하게 설명했습니다. 하지만 DOM과 CSSOM이 결합된 트리를 렌더 트리라고 하는 부분이 조금 애매합니다. 이에 대해 좀 더 자세히 알아보는 것이 좋을 것입니다. 검색 키워드 : Render tree, DOM, CSSOM, rendering process 2023. 8. 28. 렌더 트리 Q1. 브라우저에서 렌더 트리를 구축하는 과정은 어떻게 될까요? A.서버에서 받아온 html,css파일을 브라우저가 알기 쉬운 구조로 변환하고 각각 DOM과 CSSOM을 생성하여 결합한 형태가 렌더트리입니다 답변에 대한 평가 : 90점 평가 이유 : 렌더 트리가 서버에서 받아온 HTML, CSS 파일을 가지고 구축되는 것에 대해 정확하게 설명했습니다. 그러나, 조금 더 자세한 내용을 알면 좋을 것 같습니다. 예를 들어, 렌더 트리에는 어떤 요소들이 포함되나요? 그리고 렌더 트리가 생성되면 무엇을 해야 할까요? 검색 키워드 : Render tree, DOM, CSSOM, rendering process 꼬리질문 : 렌더 트리에는 어떤 요소들이 포함되나요? 그리고 렌더 트리가 생성되면 다음에 어떤 과정이 일.. 2023. 8. 26. css파싱 Q1. 브라우저의 CSS 파싱 과정은 어떻게 될까요? A.서버에서 받아온 css파일을 문자열로 읽고 문자열을 토큰으로 나누어 토큰화를 시킵니다. 토큰의 순서와 구조를 분석하여 파싱을 합니다. 그리고 스타일을 계산하고 레이아웃과 페인팅 단계로 넘어갑니다 이후 페인팅 단계에서 화면에 요소들을 그려나갑니다. 답변에 대한 평가 : 50점 평가 이유 : CSS 파싱 과정에 대해서는 일부 설명이 포함되어 있지만, 불완전하고 부분적인 설명입니다. 토큰화, 스타일 계산, 레이아웃, 페인팅 단계에 대한 내용이 더 구체적으로 설명되어야 합니다. 검색 키워드 : CSS parsing, CSS tokenization, CSS rendering pipeline 꼬리질문 : CSS 파싱 과정에서 토큰화(Tokenization)는.. 2023. 8. 25. HTML 파싱 Q1. 브라우저에서 HTML의 파싱 과정은 어떻게 될까요? A.서버에 응답한 html문서를 이진수 바이트 형태로 받는다. meta 태그의 charset 어트리뷰트에 지정된 인코딩 방식으로 문자열로 변환시킨다. 문자열은 다시 토큰으로 분해하고 분해한 토큰을 객체로 변환해 노드를 생성한다. html 요소 간의 중첩 관계를 반영해서 트리 자료 구조를 구성한다. 답변에 대한 평가 : 70점 평가 이유 : 파싱 과정에 대한 기본적인 개념과 일부 과정을 언급했지만, 제대로된 순서와 구체적인 내용이 빠져있습니다. 또한, 트리 자료 구조를 어떻게 구성하는지에 대한 설명이 더 필요합니다. 검색 키워드 : HTML parsing algorithm, HTML parsing tree construction 꼬리질문 : HTM.. 2023. 8. 24. 이전 1 2 다음