브라우저공부

브라우저 렌더링 프로세서 Browser elements Browser Rendering Process Rendering Engine(webkit) Process HTML ,CSS Parsing Process Render Process 브라우저 Rend

브라우저 저장소 웹스토리지는 HTML5부터 제공되는 기능이다 해당 할 수 있도록 제공하는 기능도메인과 관련된 특정 데이터를 클라이언트 웹브라우저에 저장 쿠키와 비슷한 기능 웹스토리지의 개념은 키/값 쌍으로 데이터를 저장하고, 키를 기반으로 데이터를 조회하는 패턴

브라우저에서 어떻게 특정 화면 요소의 이벤트를 감지하는지, 그리고 그 이벤트를 어떻게 다른 화면 요소에 전파하는지 알아보자이벤트 등록은 웹 애플리케이션에서 사용자의 입력을 받기 위해 필요한 기능이다. 이벤트 리스너는 항상 대기중이며, 해당 이벤트가 발생하면 등록했던 이

웹 브라우저의 다양한 기능을 객체처럼 다루는 모델Global Context, 브라우저 창을 나타내는 객체전역변수나 전역함수의 경우 window 프로퍼티처럼 작동한다윈도우 객체 내에 삽입된다는 것이다.덮어쓰면 기존 기능이 사라질 가능성이 있다프로퍼티에는 아래와 같은

브라우저주소창, 뒤로가기, 앞으로가기, 새로고침 등웹 페이지에서 보이는 부분 외의 영역사용자 인터페이스와 렌더링엔징을 연결해주는 역할HTML, CSS, JS를 사용자에게 렌더링(화면에 보여줌)라는 역할코드를 해석하며 다운받아야할 이미지, 스크립트, 스타일 태그가 있으면

브라우저의 성능을 저하시킬 수 있는 리페인팅/리플로우에 대해 알아보자리플로우와 리페인트는 렌더링과정에서 레이아웃 단계와 페인트 단게를 다시 거치는 과정이다.생성된 DOM노드의 레이아웃 변경 시 영향을 받는 모든 노드(부모, 자식)의 수치를 다시 계산하여 레이아웃 트리(

브라우저 관점에서 이벤트는 마우스 클릭 뿐만 아니라 휠의 움직임, 포인터 이동, 화면 터치 등 사용자가 하는 모든 동작을 의미한다.이벤트가 발생한 좌표에 무엇이 있는지 확인하기 위해 렌더링 과정중의 하나인 페인트 기록을 찾아본다.페인트 기록을 통해 좌표를 알아낸 브라우

요소에 이벤트를 등록하는 일반적인 방법은 addEventListener를 이용하는 것이다. 그렇다면 100개 요소에 이벤트를 등록하고 싶다면 어떻게 해야할까? 일일이 연결해야 할까?이벤트흐름을 잘 이용하면 1개의 이벤트 리스너로 수 많은 요소의 이벤트를 처리할 수 있다

처음 자바스크립트로 돔을 만들고 추가하는 방법을 배울 당시, document.createElement()로 생성하고, appendChild()를 이용해 DOM에 등록을 한다.DocumentFragment Node를 사용하면 오직 메모리상에만 존재하는 경량화된 DOM을