본문 바로가기

렌더링

(2)
웹 브라우저에서 HTML문서 렌더링 과정 (동작 순서) 웹 브라우저의 HTML문서 렌더링 과정 1. 불러오기로더(Loader)가 서버로부터 전달 받는 리소스 스트림을 읽는 과정.읽으면서 어떤 파일인지, 데이터인지 파일을 다운로드할 것인지 등을 결정한다.2. 파싱 (Phasing)웹 엔진이 가지고 있는 HTML/XML 파서가 문서를 파싱해서 DOM Tree를 만든다.3. 렌더링 트리 만들기DOM Tree는 내용을 저장하는 트리로 자바스크립트에서 접근하는 DOM객체를 쓸 때 이용하는 것이고 별도로 그리기 위한 트리가 만들어져야 하는데 그것이 렌더링 트리다. (그릴 때 필요없는 head, title, body태그등이 없음 + display:none 처럼 DOM에는 있지만 화면에서는 걸러내야할 것들을 걸러냄)4. CSS 결정CSS는 선택자에 따라서 적용되는 태그가 ..
Express 기초 (morgan 로깅미들웨어, 라우팅, 요청/응답 확장, 뷰 렌더링) Express 기초 주요 기능1. 미들웨어 - 하나의 함수를 통해서만 요청이 흘러가는 node.js와 대조적으로, 함수를 효과적으로 배열하는 미들웨어 스택이 있음.2. 라우팅 - HTTP메서드(get,post,put,delete...)로 특정 URL을 방문할 때만 함수가 호출됨.3. 요청/응답 개체에 대한 확장 - response.redirect(...) 나 response.sendFile(...) 처럼 확장 가능.4. 뷰 - 뷰를 사용해서 HTML을 동적으로 렌더링할 수 있음. (뷰템플릿 pug, ejs 등)Morgan로그 기록을 남기는 morgan 모듈을 설치하고 사용해본다. npm install morgan --save 명령어를 입력하여 morgan 모듈을 설치한다.123456789101112131..