# browser
브라우저마다 호출되는 순서가 다르다!
IE에서 작동하는 웹 사이트를 만들어야 했다. 하지만 IE 브라우저 자체가 속도가 느려서 개발 테스트를 하면서 크롬이나 파이어폭스를 사용했다. 그 중에서도 화면에서 API를 호출해서 활용해야 했는데, 크롬에는 해당 API가 잘 호출되었지만, IE와 파이어 폭스에서는 호
[Browser] How browser works (5) - Layout
이 글은 Tali Garsiel의 "How Browsers Work: Behind the scenes of modern web browsers"를 번역한 글입니다.Renderer 가 생성되어 트리에 추가될 때는 위치나 크기에 대한 정보를 가지고 있지 않습니다. 위치,
[Browser] How browser works (5) - Render tree construction
Render tree construction DOM 트리가 생성되는 동안, 브라우저는 Render Tree 를 생성합니다. Render Tree 는 시각적인 요소들을 화면에 나타나는 순서대로 가지고 있습니다. 이는 요소들을 올바른 순서대로 그리는 것을 목표로 합니다
[Browser] How browser works (4) - CSS parsing
CSS parsing HTML과는 다르게, CSS는 context free grammer(문맥 자유 문법) 이기 때문에 General parser 에서 설명한 것과 같이 파싱할 수 있습니다. CSS 명세에는 CSS의 어휘와 구문이 정의되어 있습니다. CSS의 어
[Browser] How browser works (2) - General Parser
Parsing-genenral 파싱한다는 것은 문서를 코드가 읽을 수 있는 구조로 변환하는 것을 의미합니다. 파싱의 결과는 대부분 문서 구조를 나타내는 노드로 이루어진 트리입니다. 이 트리는 parse tree 혹은 syntax tree라고 불립니다. 예를 들어,
[Browser] Cookies vs Local Storage
Cookies는 오래동안 웹 사이트를 방문하는 사용자의 정보를 저장하는 주된 방식이었습니다. 이는 쇼핑몰의 장바구니나 옵션과 같은 상태를 저장할 뿐만 아니라, 사용자의 검색 기록을 저장하고, 로그인 상태를 유지하는 데 사용되었습니다. HTML5가 나오면서, Local
TIL 20 | 브라우저 좌표 (coordinates)
URL 창 제외한 브라우저의 좌측 상단 시작점이 (0,0)이다.수평축을 X, 수직축을 Y로 둔다.요소의 사이즈나 위치에 관련된 다양한 정보 확인 가능DOM 내 태그의 모든 요소는 .getBoundingClientRect라는 함수를 사용할 수 있다.ex) Image El
.jpg?w=120)
TIL24 l Window & BOM
1. Window Window 인터페이스는 DOM 문서를 담은 창을 나타내며, 다양한 함수, 이름공간, 객체, 생성자가 머무는 장소이다. 콘솔 창에 Window를 치면 다음과 같이 출력된다. △ 사진에서 알 수 있듯이 객체화된 수많은 구성 요소들로 이루어져 있다.
TIL22 l Browser Rendering
브라우저란? 웹 브라우저 또는 브라우저는 웹에서 페이지를 찾아서 보여주고, 사용자가 하이퍼링크를 통해 다른 페이지로 이동할 수 있도록 하는 프로그램입니다. 브라우저는 가장 익숙한 타입의 사용자 에이전트입니다. 브라우저의 주요 기능 브라우저의 주요 기능은 사용자가 선
TIL 109 | 브라우저의 동작 원리
브라우저는 사용자가 선택한 자원을 서버에 요청하고 브라우저에 표시한다. 자원은 보통 HTML 문서지만, PDF나 이미지 또는 다른 형태일 수도 있다.
브라우저 렌더링
이번 포스팅에선 브라우저가 화면을 렌더링 하는 과정에 대해서 알아보겠다.렌더링이란 HTML, CSS, JavaScript 등 개발자가 작성한 문서들을 브라우저가 화면에 그려주는 동작을 말한다.렌더링에 관해 얘기하기 전에 브라우저 구조에 대해 알아보자.User Inter
프론트엔드 개발 Basic
회사에서 웹 기반 검색 서비스 제품(딥러닝 응용)을 기획하고 있는데, 아마 이번달 안으로 제품 기능 명세와 화면 정의가 나오게 될 것 같다. 관련해서, 예전부터 틈틈히 학습하던 웹 개발을 본격적으로 실무 위주로 이어나가려고 한다. 이번 문서는 완전 기본적으로 무조건
