브라우저 프로세스
컴퓨터나 스마트폰에서 애플리케이션을 실행할 때 애플리케이션을 구동하는 것이 바로 CPU와 GPU이다.
CPU
컴퓨터의 두뇌로 프로그램 실행을 위한 핵심적인 작업을 수행함.
CPU 코어는 여러 종류의 작업을 하나씩 순서대로 처리할 수 있다.
코어가 많을 수록 성능이 좋다.
GPU
그래픽 작업을 처리하기 위해 개발.
간단한 작업에만 특화되어 있지만 여러 GPU 코어가 동시에 작업을 수행할 수 있다.
그래픽 관련 작업을 분담해 빠른 렌더링과 매끄러운 상호작용을 할 수 있게 해줌.
하드웨어 가속
특정 작업을 CPU가 아닌 다른 특별한 장치를 통해 수행 속도를 높이는 것.
그래픽(GPU)이나 사운드와 관련된 작업에 하드웨어 가속을 많이 사용한다.
프로세스
-
운영체제는 프로세스가 작업할 메모리(하드웨어)를 "한 조각" 주는데, 이 전용 메모리 공간에 애플리케이션의 모든 상태가 저장된다. 애플리케이션을 닫으면 프로세스가 사라지고 운영체제가 메모리를 비운다.
-
두 프로세스가 서로 정보를 공유해야 할 때는 IPC(inter process communication, 프로세스 간 통신)를 사용한다.
-
브라우저는 다중 프로세스 아키텍쳐를 사용하며 프로세스간 IPC통신을 하며 동작한다.
주요 프로세스들
브라우저 프로세스
주소 표시줄, 북마크 막대, 뒤로 가기 버튼, 앞으로 가기 버튼 등의 브라우저 ui
네트워크 요청이나 파일 접근과 같이 눈에 보이지는 않지만 권한이 필요한 부분
ui스레드, 네트워크 스레드, 스토리지 스레드
렌더러 프로세스
탭 안에서 웹 사이트가 표시되는 부분의 모든 것을 제어한다.
메인 스레드에서 주요 렌더링 과정을 진행하지만 효율적이고 부드럽게 렌더링하기 위해 별도의 컴포지터 스레드와 래스터 스레드가 렌더러 프로세스에서 실행된다.
플러그인 프로세스
웹 사이트에서 사용하는 플러그인(예: Flash)을 제어한다.
GPU 프로세스
GPU 작업을 다른 프로세스와 격리해서 처리한다.
최신 브라우저의 내부 살펴보기 1 - CPU, GPU, 메모리 그리고 다중 프로세스 아키텍처
캐시
캐시란?
데이터나 값을 미리 복사해 놓는 임시 장소를 가리킨다.
캐시의 접근 시간에 비해 원래 데이터를 접근하는 시간이 오래 걸리는 경우나 값을 다시 계산하는 시간을 절약하고 싶은 경우에 사용한다. 캐시에 데이터를 미리 복사해 놓으면 계산이나 접근 시간 없이 더 빠른 속도로 데이터에 접근할 수 있다.
웹 캐시란?
사용자(client)가 웹 사이트(server)에 접속할 때, 정적 컨텐츠(이미지, JS, CSS 등)를 특정 위치(client, network 등)에 저장하여, 웹 사이트 서버에 해당 컨텐츠를 매번 요청하여 받는것이 아니라, 특정 위치에서 불러옴으로써 사이트 응답시간을 줄이고, 서버 트래픽 감소 효과를 볼 수 있다.
브라우저 캐시
브라우저 캐시는 웹 캐시의 일종으로, 브라우저가 웹사이트의 에셋을 저장하는 것이다.
일반적으로 브라우저는 정적 자산(static asset)을 캐싱한다.
1. 이미지 - 로고, 사진, 백그라운드 등
2. HTML
3. CSS
4. JavaScript
