[Frontend] 기술면접 top30
해당 질문에 면접에서 답변할 수 있을 정도의 길이(3~4줄)로 답변을 달아보세요. 특히 면접 답변의 핵심은 두괄식(핵심을 먼저 말하는 것)입니다. 완성 후, 면접 하루 전날 족보처럼 훑어보고 면접을 보러갑시다!
📌브라우저의 작동방식에 대해서 설명해주세요.
답변▶️ 브라우저의 작동 방식은 다음과 같은 단계로 이루어집니다.
- URL 입력 및 요청: 사용자가 URL을 입력하면 브라우저는 해당 주소의 웹 서버에 HTTP 요청을 보냅니다.
- 서버 응답 및 데이터 수신: 서버는 요청을 처리하고 HTML, CSS, JavaScript 파일 등을 브라우저에게 응답으로 보냅니다.
- HTML 파싱 및 DOM 생성: 브라우저는 HTML을 파싱하여 Document Object Model (DOM) 트리를 만듭니다. 이 트리는 웹 페이지의 구조를 나타냅니다.
- CSS 파싱 및 CSSOM 생성: CSS 파일도 파싱되어 CSS Object Model (CSSOM) 트리가 생성됩니다. 이것은 페이지의 스타일을 정의합니다.
- 렌더 트리 생성: DOM과 CSSOM을 결합하여 렌더 트리를 생성합니다. 이 트리는 페이지의 시각적 표현을 나타내며, 각 요소의 크기와 위치를 포함합니다.
- 레이아웃 단계: 렌더 트리를 기반으로 브라우저는 각 요소의 크기와 위치를 계산합니다.
- 페인팅: 계산된 스타일과 레이아웃 정보를 사용하여 화면에 페이지를 그립니다. 여기에는 텍스트, 이미지, 다른 시각적 요소들이 포함됩니다.
- JavaScript 실행: 필요한 경우 JavaScript가 실행되어 동적인 기능을 추가하거나 페이지를 변경합니다.
- 로드 완료: 모든 요소와 스크립트가 로드되고 실행되면 페이지 로딩이 완료됩니다. 사용자는 이제 페이지와 상호 작용할 수 있습니다.
이러한 과정은 빠르게 일어나며 사용자에게는 매끄럽게 보이게 됩니다. 동적인 웹 페이지의 경우 추가적인 비동기 요청과 작업이 있을 수 있어, 사용자와의 상호 작용에 따라 계속 업데이트될 수 있습니다.
