본문 바로가기

전체 글18

브라우저 랜더링 1(과정) 브라우저 랜더링을 알기 전 간단하게 알아보자 1) 브라우저 구성요소 2) 각각의 요소들이 어떤기능을 해서 브라우저가 랜더링하는지 브라우저 구성요소 다음과 같은 요소들이 있고 설명은 아래와 같다 사용자 인터페이스 : 주소표시줄, 이전 및 다음 버튼 새로고침 북마크등 보여주는 페이지를 제외한 부분 브라우저 엔진 : 사용자 인터페이스와 렌더링 엔진 사이의 동작을 제어 랜더링엔진 : 요청한 콘텐츠를 표시 요청을 통해 받아온 정보를 HTML과 CSS로 파싱해서 화면에 표시 통신레이어 : HTTP요청과 같은 네트워크 호출에 사용됨 플랫폼 독립적인 인터페이스이고 각 플랫폼하부에서 진행됨 자바스크립트 해석기 :자바스크립트 코드를 해석하고 실행 자료 저장소 :자료를 저장하는 계층 쿠키, 로컬스토리지 등 UI 백엔드 : .. 2023. 9. 20.
front-end 기초 개요 Moment- film이라는 온라인 네컷 포토부스 프로젝트가 끝나고 유지보수를 하기 전에 내가 뭘하고 있는 건지 확실하게 할 필요가 있어 관심이 갔습니다. 제가 생각한 프론트엔드는 화면단, 서버로 부터 받아서 화면에 효율적이고 사용자 친화적으로 보여주는 것 그렇다면 화면에 어떻게 보여지게 되는가는 중요할 수 밖에 없습니다. 설명해보라하면 서버로 부터 데이터를 받아서 브라우저의 자바스크립트 엔진이 파싱해서 트리형태의 돔으로 변환 해당 돔을 동적으로 보여주기 위해 자바스크립트를 사용합니다라고 답하겠지만 그래서 그게 왜 중요하냐고 물어보면 ??????? 답이 없습니다 ,,.. 그래서 개인적으로 공부한 기초들을 기록해 보려합니다 시작은 브라우저 랜더링부터 다른 어려운 개념들까지 왜 그렇고 어떻게 그런지 알아보겠.. 2023. 9. 19.