본문 바로가기

개인공부/FrontEnd6

브라우저의 렌더링 원리 렌더링이란? 렌더링이란 서버로부터 HTML 파일을 받아 브라우저에 뿌려주는 과정이다. 브라우저가 화면에 나타나는 요소를 렌더링할 때, 웹킷이나, 게코 등과 같은 렌더링엔진을 사용한다. 렌더링 엔진이 HTML, CSS, JavaScript로 렌더링할때 CRP라는 프로세스를 사용하며 6단계로 이루어져 있다. HTML 파싱 후, DOM트리 구축 CSS 파싱 후, CSSOM트리 구축 JavaScript 실행 DOM과 CSSOM을 조합하여 렌더트리를 구축 display: none 속성과 같이 화면에서 보이지도 않고 공간 차지하지 않는 것은 렌더트리로 구축되지 않는다. 뷰포트 기반으로 렌더트리의 각 노드가 가지는 정확한 위치와 크기를 계산한다. ( Layout 단계 ) 계산한 위치/크기를 기반으로 화면에 그린다. .. 2022. 12. 28.
호스팅 호스팅 호스팅이란 정보의 집약체인 서버의 전체 혹은 일부를 이용할 수 있도록 임대해 주는 서비스이다. 서버를 관리하기 위해서는 24시간 내내 안정적으로 전기를 공급해야 하고, 빠르고 안정적인 인터넷회선을 사용해야 하며 철저한 보안시스템을 갖추고 있어야 한다. 따라서 개인이 서버를 관리하기보다 전문 업체의 호스팅 서비스를 사용하는 것이 일반적. 호스팅 종류 웹 호스팅 웹 호스팅은 여러 고객이 하나의 서버를 함께 사용하는 형태. 하나의 서버를 나누어 쓰기 때문에 저렴하게 이용할 수 있고, 호스팅 업체의 통합 관리를 받기에 편리하다. 사용할 수 있는 하드웨어 제한적이라는 단점 서버 호스팅 서버 호스팅은 고객이 단독 서버를 사용하는 형태. 넓은 하드웨어 공간을 사용할 수 있고, 서버 운영/관리에 대한 직접적인 .. 2020. 7. 11.
DNS DNS(도메인 네임 시스템) Www.example.com과 같이 사람이 읽을 수 있는 이름을 192.0.2.1과 같은 숫자 IP주소로 변환하여 컴퓨터가 서로 통신할 수 있도록 한다. 인터넷의 DNS 시스템은 이름과 숫자 간의 매핑을 관리하여 마치 전화번호부와 같은 기능 DNS 서버는 이름에 대한 요청을 IP 주소로 변환하여 최종 사용자가 도메인 이름을 웹 브라우저에 입력할 때 해당 사용자를 어떤 서버에 연결할 것인지를 제어 한다. 이 요청을 쿼리라고 한다. Domain 구조 인터넷상에서 사용되는 도메인은 전 세계적으로 고유하게 존재하는 이름 정해진 규칙 및 체계에 다라야 함, 임의로 변경되거나 생성될 수 없음. 인터넷상의 모든 도메인은 “.(dot)” 또는 루트라 불리는 도메인 아래에 그림과 같이 나무를.. 2020. 7. 10.
브라우저와 동작원리 브라우저는 가장 많이 사용하는 소프트웨어이다. www.naver.com을 입력했을 때 어떤 과정을 거쳐 네이버 페이지가 화면에 보이게 되는지 알아보자! 최근 익스플로러, 파이어폭스, 사파리, 크롬, 오페라 이렇게 다섯 개의 브라우저를 많이 사용한다. 브라우저의 주요 기능 브라우저의 주요 기능은 사용자가 선택한 자원을 서버에 요청하고 브라우저에 표시하는 것이다. 자원은 보통 HTML 문서지만 PDF나 이미지 또는 다른 형태일 수 도 있다. 자원의 주소는 URI(Uniform Resource Idendtifier)에 의해 정해진다. 브라우저는 HTML과 CSS 명세에 따라 HTML 파일을 해석해서 표시하는데, 이 명세는 웹 표준화 기구인 W3C에서 정한다. 과거에는 브라우저들이 일부만 이 명세에 따라 구현하.. 2020. 7. 10.