면접10 [면접] 프론트엔드 기술면접 프론트엔드 기술면접을 위해 여러 자료를 공부하고 정리하면서 업데이트 중입니다. 중요도 ★★★★★ 브라우저 렌더링 과정 HTML 파싱 후, DOM(Document Object Model) 트리 구축 CSS 파싱 후, CSSOM(CSS Object Model) 트리 구축 Javascript 실행 주의! HTML 중간에 스크립트가 있다면 HTML 파싱이 중단된다. DOM과 CSSOM을 조합하여 렌더트리(Render Tree) 구축 주의! display: none 속성과 같이 화면에서 보이지도 않고 공간을 차지하지 않는 것은 렌더트리로 구축되지 않는다. 뷰포트 기반으로 렌더트리의 각 노드가 가지는 정확한 위치와 크기 계산 (Layout/Reflow 단계) 계산한 위치/크기를 기반으로 화면에 그림 (Paint 단.. 2023. 2. 16. [면접] 네트워크 기술면접 TCP/IP란? 정의 TCP/IP 4계층은 장치들이 인터넷 상에서 데이터를 주고 받을 때 쓰는 독립적인 프로토콜의 집합입니다. 각 계층 설명 어플리케이션 계층 (Application Layer) HTTP,SMTP,SSH,FTP 가 대표적이며 웹사이트 등 실제로 유저에게 제공하는 층입니다. 전송 계층 (Transport Layer) TCP, UDP가 대표적이며 어플리케이션에서 받은 데이터를 기반으로 세그먼트 or 데이터그램으로 데이터를 쪼개고 전달하는 층 인터넷 계층 (Internet Layer) IP,ARP가 대표적이며 한 노드에서 다른 노드로 전송 계층에서 받은 세그먼트 또는 데이터그램을 패킷화 하여 목적지로 전송한다. 링크 계층 (Network Layer) 전선, 광섬유, 무선 등으로 데이터가 네트워.. 2023. 1. 31. [네트워크] www.naver.com을 입력했을때 과정 모범답안 대기열, 캐싱, DNS, 라우팅, ARP, 초기연결을 거쳐 컨텐츠를 다운받게 되고 이 후 브라우저렌더링 과정을 거쳐 네이버 화면이 나타나게 됩니다. 또한, 이러한 과정이 캡슐화, 비캡슐화 과정을 거쳐서 이뤄지게 됩니다. 1. 웹 브라우저에 URL 입력 URL의 구조 https://hanseul-lee.github.io/2020/12/24/20-12-24-URL/ 1. Protocol(Scheme) http(Hyper Text Transfer Protocol) 는 프로토콜(규약)이다. URL의 첫 파트이자 웹에서 서버와 클라이언트간에 어떤 방법으로 자원을 접근할지 알려준다. 2. Domain Name 도메인 네임은 URL에서 웹 서버의 위치를 지정한다. 직접 IP 주소를 사용하는 것도 가능하다. .. 2023. 1. 26. [네트워크]3-way handshake / 4-way handshake TCP 연결 성립 과정 3-웨이 핸드셰이크(3-way handshake) 클라이언트와 서버가 통신할 때 하기와 같은 세 단계의 과정을 거친다. SYN 단계 : 클라이언트는 서버에 클라이언트의 ISN을 담아 SYN을 보낸다. SYN + ACK 단계 : 서버는 클라이언트의 SYN을 수신하고 서버의 ISN을 보내며 승인번호로 클라이언트의 ISN+1을 보낸다. ACK 단계 : 클라이언트는 서버의 ISN+1한 값인 승인번호를 담아 ACK를 서버에 보낸다. ISN? ISN은 새로운 TCP 연결의 첫 번재 패킷에 할당된 임의의 시퀀스 번호이며 장치마다 다를 수 있다. TCP 연결 해제 과정 4-웨이 핸드셰이크(4-way handshake) TCP가 연결을 해제할 때는 하기의 네 단계의 과정을 거친다. 클라이언트가 연.. 2023. 1. 10. 이전 1 2 3 다음
