기술면접 4

10월 5주차 기술면접 대비 질의응답

10.231. 크리티컬 렌더링 패스 (Critical Rendering Path)크리티컬 렌더링 패스는 브라우저가 HTML, CSS, JavaScript 파일을 받아서 화면에 페이지를 그리는 과정입니다.  1. HTML 파싱 및 DOM 생성: 브라우저는 HTML 파일을 받아서 DOM(Document Object Model)을 생성합니다. DOM은 HTML 문서의 구조를 트리 형태로 표현한 것입니다.2. CSS 파싱 및 CSSOM 생성: CSS 파일을 파싱하여 CSSOM(CSS Object Model)을 생성합니다. CSSOM은 CSS 스타일 정보를 트리 형태로 표현한 것입니다.3. 렌더 트리 생성: DOM과 CSSOM을 결합하여 렌더 트리를 생성합니다. 렌더 트리는 실제로 화면에 그려질 요소들만 포함합니..

기술면접 2024.10.28

10.7 기술면접 공부 정리

알고리즘 및 자료구조 관련 문제 1. 링크드 리스트 vs 어레이- 구조 배열 : 연속된 메모리 공간에 데이터를 저장하고, 각 요소는 인덱스르 통해 접근한다.링크드 리스트 : 각 요소가 데이터와 다음 노드에 대한 포인터를 포함한다. 메모리 공간이 연속적이지 않다. - 크기배열 : 고정 크기로 선언된다. 크기 변경이 불가능한다.링크드 리스트 : 동적 크기로, 노드를 추가하거나 제거할 수 있어서 크기가 유동적이다. - 접근 시간배열 : 인덱스를 사용하기에 O(1)의 시간복잡도링크드 리스트 : 특정 노드에 접근하려면 O(n)이 걸릴 수 있다. - 삽입 및 삭제배열 - 삭제 후 남은 요소들을 이동해야 하므로 O(n)의 시간복잡도링크드 리스트 - 노드의 포인터만 변경하면 되므로 O(1)시간에 삽입 및 삭제가 가능하..

기술면접 2024.10.11

브라우저 렌더링의 원리

브라우저 주소 창에 tistory.com 을 입력했을때의 과정 브라우저란 사용자의 자원(html / pdf / 이미지 등)을 서버에 요청하고 표시하는것이 주 기능이다. 자원의 주소는 URI에 의해 정해진다. 브라우저의 구성요소 - 사용자 인터 페이스: 요청 페이지 창 제외 나머지 모든 부분 -브라우저 엔진: 사용자 인터페이스와 렌더링 엔진 사이 제어 -렌더링 엔진 : 요청한 콘텐츠를 표시 -통신 : 네트워크 호출에 사용 - UI 백엔드 : 창 기본적인 장치를 그림 -JS 엔진 : JS를 해석하고 실행함 -자료 저장소 : 쿠키 등의 자원을 저장함 렌더링 엔진의 기본적인 동작 과정 1. 서버에서 HTML, CSS를 Parser을 사용하여 DOM, CSSOM으로 만든다 이때 tree들이 만들어진다 2. DOM..

기술면접 2022.12.24

12/17 기술면접 정리

1. div와 span 의 차이점 콘텐츠의 영역이나 그룹화를 할때 사용 다른 텍스트와 구별하기 위해 사용 div는 가로공간 전체를 차지하고 인라인요소가 아니기에 width, height 크기 지정이 가능하고 줄바꿈이 되지만 span은 인라인 요소이며 문장의 길이공간만큼 차지함 핵심은 줄바꿈!!!! 2. 이벤트 버블링 이란? 어떤 객체에 대한 이벤트가 발생했을때, 해당 객체의 최상위 부모까지 이벤트가 전달 되는 과정 html구조상 자식 요소에 발생한 이벤트가 상위 요소에 영향을 미치는 것인데 이를 차단하고 싶을때는 e.stopPropagation을 호출하면 이벤트 전파를 막을 수 있다. 3. 'Call by value'와 'Call by reference'란? 변수 혹은 객체등이 함수의 인자로 들어와 매개..

기술면접 2022.12.17