밑바닥부터 시작하는 웹 브라우저(한빛미디어) 도서 리뷰

“한빛미디어 <나는 리뷰어다> 활동을 위해서 책을 제공받아 작성된 서평입니다.”

시작에 앞서

웹 개발자라면 한 번쯤 “브라우저는 내부에서 어떤 과정을 거쳐 페이지를 띄우는 걸까?”라는 궁금증을 가져보셨을 겁니다. 저도 브라우저를 언젠가 더 공부해봐야지 생각하고 있었는데 마침 그럴 기회가 생겼습니다. 밑바닥부터 시작하는 웹 브라우저는 단순히 원리를 설명하는 데 그치지 않고, 브라우저의 핵심 기능을 직접 구현해보며 동작 원리를 체득하는 과정에 초점을 맞춥니다. 무언가를 배우는 가장 좋은 방법은 직접 해보는 것이라는 말이 있는 것처럼 이 책을 통해 브라우저의 동작 원리를 직접 구현해보며 이해할 수 있었습니다.

챕터별 내용 요약

PROLOGUE 브라우저와 나

브라우저의 기본 개념과 이 책에서 구현할 브라우저의 전체적인 구조를 소개합니다.

PART 1 페이지 로딩

CHAPTER 1 웹페이지 다운로드

HTTP 프로토콜을 통한 서버 연결과 데이터 다운로드 과정을 구현합니다. TCP 소켓 연결, HTTP 요청/응답 처리, HTTPS 암호화 연결까지 다룹니다.

CHAPTER 2 화면에 그리기

tkinter를 이용해 브라우저 창을 만들고 기본적인 그래픽 렌더링을 구현합니다. 텍스트 배치, 스크롤 기능, 렌더링 최적화 기법을 학습합니다.

CHAPTER 3 텍스트 포맷팅하기

폰트의 기본 개념부터 시작해 텍스트 측정, 스타일링, 레이아웃 객체 설계까지 텍스트 렌더링의 모든 과정을 구현합니다.

PART 2 문서 표시

CHAPTER 4 문서 트리 구축하기

HTML 파싱을 통해 DOM 트리를 구축하는 과정을 구현합니다. 파서 디버깅, 셀프 클로징 태그 처리, 오류 처리까지 다룹니다.

CHAPTER 5 페이지 레이아웃

렌더 트리와 레이아웃 계산 과정을 구현합니다. 블록 레이아웃, 크기/위치 계산, 재귀 페인팅, 배경 그리기까지 다룹니다.

CHAPTER 6 개발자 스타일 적용하기

CSS 파싱과 스타일 적용 과정을 구현합니다. 셀렉터 매칭, 캐스케이딩, 스타일 상속, 폰트 프로퍼티 처리까지 다룹니다.

CHAPTER 7 버튼과 링크 처리하기

인터랙티브 요소들의 처리 방법을 구현합니다. 링크 처리, 클릭 이벤트, 탭 브라우징, 히스토리 탐색, URL 입력까지 다룹니다.

PART 3 애플리케이션 실행

CHAPTER 8 서버로 정보 보내기

HTML 폼의 동작 원리와 서버로 데이터를 전송하는 과정을 구현합니다. 폼 요소 렌더링, 상호작용, POST 요청 처리까지 다룹니다.

CHAPTER 9 대화형 스크립트 실행하기

DukPy 자바스크립트 엔진을 이용해 JS 코드 실행 환경을 구현합니다. 브라우저 API 노출, 이벤트 처리, DOM 조작까지 다룹니다.

CHAPTER 10 사용자 데이터 보호하기

웹 보안의 핵심 개념들을 구현합니다. 쿠키, 인증 시스템, CORS, Same-Origin Policy, CSRF/XSS 방어, CSP까지 다룹니다.

PART 4 모던 브라우저 기능

CHAPTER 11 시각적 효과

Skia와 SDL을 이용한 하드웨어 가속 그래픽 렌더링을 구현합니다. 컴포지팅, 투명도, 블렌딩, 마스킹까지 다룹니다.

CHAPTER 12 태스크와 스레드 스케줄링

비동기 작업 관리와 멀티스레딩을 구현합니다. 태스크 큐, 타이머, 렌더링 주기, 성능 최적화까지 다룹니다.

CHAPTER 13 애니메이션과 컴포지팅

GPU 가속 애니메이션과 컴포지팅을 구현합니다. JS 애니메이션, CSS 트랜지션, 컴포지팅 최적화까지 다룹니다.

CHAPTER 14 콘텐츠 접근성 향상

웹 접근성 기능들을 구현합니다. 줌, 다크 모드, 키보드 내비게이션, 스크린 리더 지원까지 다룹니다.

CHAPTER 15 삽입된 콘텐츠 지원

이미지와 iframe 등 복잡한 콘텐츠를 처리합니다. 이미지 렌더링, iframe 통신, 보안 고려사항까지 다룹니다.

CHAPTER 16 이전 결과 재사용

렌더링 성능 최적화를 위한 캐싱과 무효화 전략을 구현합니다. 의존성 관리, 캐시 무효화, 불필요한 재계산 방지까지 다룹니다.

CHAPTER 17 이 책에서 다루지 않은 내용

현대 브라우저의 고급 기능들과 향후 학습 방향을 제시합니다.

EPILOGUE 변화하는 환경

웹 기술의 발전과 브라우저의 미래에 대한 전망을 다룹니다.

입력에서 렌더링까지, 브라우저의 모든 여정

이 책은 사용자가 주소창에 URL을 입력한 순간부터 화면에 결과가 그려지기까지의 전체 과정을 코드와 함께 따라갑니다.

• Part 1에서는 DNS, HTTP, TLS 등 네트워크 단계에서 실제 요청과 응답이 어떻게 이루어지는지를 다룹니다.
• Part 2에서는 HTML 파싱, DOM 트리 생성, CSS 스타일 적용, 레이아웃 계산과 같은 렌더링 파이프라인을 구현합니다.
• Part 3~4에서는 자바스크립트 실행, 이벤트 처리, 폼 제출, 스레드 및 GPU 가속 등 현대 브라우저의 복잡한 동작까지 확장합니다.

직접 만드는 브라우저 – 실습 중심 학습

이 책의 가장 큰 매력은 파이썬으로 브라우저를 한 줄씩 구현해 나가는 구성입니다. 단순히 설명을 읽는 것이 아니라, 직접 코드를 작성해 실행하면서 “내가 만든 프로그램이 웹페이지를 띄운다”는 감각을 얻을 수 있습니다.

특히 프론트엔드 개발자에게는 “렌더링 과정의 원리”를 실감나게 이해할 수 있는 실습 경험이 될 것입니다. 렌더링 속도나 레이아웃 변화 같은 현상을 단순히 ‘느낌’으로 접근하는 대신, 그 근거를 브라우저 내부 구조에서 찾아볼 수 있게 됩니다.

처음엔 간단한 글자들을 렌더링하는 것부터 렌더 트리를 구축하고 레이아웃, 스타일을 적용하는 등 점진적으로 브라우저의 기능들을 하나씩 구현해 나가는 구성이 좋았습니다. 이 과정을 직접 구현해보며, “웹 브라우저가 화면을 만드는 과정이 얼마나 세밀한 설계 위에 있는지”를 몸소 경험할 수 있습니다.

그리고 연습 문제를 통해서 책에서 구현한 부분에서 더 나아가 도전적인 기능들을 구현해 볼 수 있는 기회를 제공합니다.