우리가 사용하고 있는 Chrome은 멀티 프로섹스 아키텍처로 이루어져있다는 사실을 아시나요? 크롬에는 어떤 종류의 프로세스가 있는지, 무슨 이유로 멀티 프로세스를 채택했는지, 이러한 장점은 무엇인지 알아보려 합니다.

컴퓨터의 핵심은 CPU와 GPU

먼저, 브라우저가 실행되는 환경을 이해하려면 컴퓨터의 몇 가지 부분과 그 작업을 이해해야 합니다.

CPU

CPU는 컴퓨터의 두뇌라고 볼 수 있습니다. 과거에는 대부분의 CPU가 단일 칩이었습니다. 코어는 같은 칩에 있는 다른 CPU와 같습니다. 최신 하드웨어에는 코어가 두 개 이상 있어 휴대전화와 노트북에 더 많은 컴퓨팅 성능을 제공합니다.

GPU

그래픽 Unit(GPU)은 컴퓨터의 또 다른 일부입니다. CPU와 달리 GPU는 간단한 작업을 처리하는 데 훌륭하지만 동시에 여러 코어에서 가능합니다. 이름에서 알 수 있듯이 처음에는 그래픽을 처리하기 위해 개발되었습니다. 이러한 이유로 그래픽의 맥락에서 'GPU 사용' 또는 'GPU 지원'이 빠른 렌더링과 원활한 상호작용과 관련이 있습니다. 최근 몇 년 동안 GPU 가속 컴퓨팅으로 GPU만으로 점점 더 많은 계산이 가능해지고 있습니다.

CPU vs GPU

CPU의 연산을 담당하는 연산장치(ALU)는 구조가 매우 복잡하고, 각종 제어 처리를 담당하고 있습니다.그래서 명령어가 입력된 순서로 출력하는 직렬 처리 방식 및 복잡한 계산에 대한 빠른 처리가 가능합니다.

그에 비해 GPU는 연산 장치(ALU)의 구조가 단순하고,작은 제어/캐시 영역을 가집니다. 그리고 많은 코어로 이루어져 있습니다. 병렬연산이 필요한 3D 렌더링이나, 딥러닝, 블록체인 등에 GPU가 사용되고 있으며 연산을 가속해주기에 '가속기'라는 명칭으로 불리기도 합니다.

CPU: 소수의 고성능 코어로 구성되어 있으며, 복잡한 연산을 빠르게 처리하는 데 최적화되어 있습니다. CPU는 각 코어가 강력하고 복잡한 명령어 집합을 처리할 수 있게 설계되었습니다.
GPU: 다수의 저성능 코어로 구성되어 있으며, 대규모 병렬 연산을 처리하는 데 최적화되어 있습니다. GPU의 코어는 상대적으로 단순한 명령어 집합을 빠르게 처리할 수 있게 설계되었습니다.

프로세스 및 스레드에서 프로그램 실행

브라우저 아키텍처를 살펴보기 전에 알아야 할 또 다른 개념은 프로세스와 스레드입니다. 프로세스는 애플리케이션의 실행 프로그램입니다. 스레드는 프로세스 내부에 상주하며 프로세스 프로그램의 모든 부분을 실행하는 스레드입니다.

프로세스

다음은 Chrome 프로세스와 해당 프로세스가 제어하는 항목이 설명되어 있습니다.

브라우저 프로세스

주소 표시줄, 북마크, 뒤로 및 앞으로 버튼을 포함하여 애플리케이션의 'chrome' 부분을 제어합니다.
네트워크 요청, 파일 액세스 등 웹브라우저에서 보이지 않고 권한이 있는 부분도 처리합니다.

렌더러 프로세스

웹사이트가 표시되는 탭 내부의 모든 항목을 제어합니다.
(main thread, composite thread가 속해있습니다.)

플러그인 프로세스

웹사이트에서 사용하는 플러그인(예: 플래시)을 제어합니다.
예:) Adobe Flash Player, PDF Viewer

GPU 프로세스

GPU 작업을 다른 프로세스와 분리하여 처리합니다. GPU가 여러 앱의 요청을 처리하고 동일한 노출 영역에 그리므로 다른 프로세스로 분리됩니다. 이 외에도 확장 프로세스 및 유틸리티 프로세스와 같은 더 많은 프로세스가 있습니다.

Chrome에서 실행 중인 프로세스 수를 확인하려면 오른쪽 상단의 옵션 메뉴 아이콘 more_vert을 클릭하고 도구 더보기를 선택한 다음 작업 관리자를 선택합니다. 그러면 현재 실행 중인 프로세스와 사용 중인 CPU/메모리의 목록이 포함된 창이 열립니다.

그 외

또한 확장 프로세스 및 유틸리티 프로세스와 같은 더 많은 프로세스가 있습니다. Chrome에서 실행 중인 프로세스 수를 확인하려면 오른쪽 상단의 옵션 메뉴 아이콘 more_vert을 클릭하고 도구 더보기를 선택한 다음 작업 관리자를 선택합니다. 그러면 현재 실행 중인 프로세스와 사용 중인 CPU/메모리의 목록이 포함된 창이 열립니다.

저는 youtube 와 naver 탭을 열어두었습니다.

오른쪽 상단 도구 더보기-> 작업관리자로 실행중인 프로세스들을, 메모리사용량, CPU등을 확인할 수 있습니다.

사실 프로세스 간 통신은 어렵다

프로세스간 통신은 스레드간 통신보다 어렵습니다. 스레드는 같은 프로세스 내의 스레드들은 메모리 공간을 공유합니다. 따라서 스레드 간의 통신은 단순히 공유 메모리 공간에 접근하는 것으로 해결될 수 있어 더 간단합니다. 하지만 각 프로세스는 독립된 메모리 공간을 가집니다. 프로세스는 다른 프로세스의 메모리 영역에 직접 접근할 수 없기 때문에 데이터를 주고받기 위해서는 운영 체제가 제공하는 특수한 IPC 메커니즘(예: 파이프, 소켓, 공유 메모리 등)을 사용해야 합니다.

프로세스끼리간의 통신이 어떻게 가능한가

IPC(Inter Process Communication)

프로세스는 다른 프로세스를 돌려서 별도의 작업을 수행하도록 운영체제에 요청할 수 있습니다. 이렇게 되면 운영체제는 별도의 메모리 공간을 새 프로세스에 할당합니다. 이 때 두 프로세스간 통신이 필요하면 IPC(Inter Process Communication)를 이용합니다.

많은 애플리케이션이 이러한 방식으로 작동하도록 설계되어 있으므로 작업자 프로세스가 응답하지 않는 경우 애플리케이션의 다른 부분을 실행 중인 다른 프로세스를 중지하지 않고 다시 시작할 수 있습니다.

크롬이 멀티 프로세스를 채택한 이유

구글 크롬(Google Chrome)이 멀티 프로세스 아키텍처를 채택한 이유는 주로 안정성, 보안, 성능을 향상시키기 위해서입니다.

안정성 (Stability)

각 탭이 별도의 프로세스로 실행되기 때문에 하나의 탭이 충돌하거나 문제가 생기더라도 다른 탭에 영향을 주지 않습니다. 이는 전체 브라우저가 다운되는 것을 방지하고, 사용자 경험을 개선합니다.

보안 (Security)

(*샌드박싱은 보안 기술의 하나로 외부로부터 들어온 프로그램이 보호된 영역에서 동작해 시스템이 부정하게 조작되는 것을 막는 보안 형태입니다. 악의적인 의도를 가진 자료라 하더라도 가상으로 독립된 공간에서 발견된 것이므로 처리나 대처가 용이하게 됩니다.)

운영체제에서는 프로세스의 권한을 제한하는 방법을 제공하므로 브라우저에서는 특정 기능의 특정 프로세스를 샌드박스 처리할 수 있습니다. 예를 들어 Chrome 브라우저는 렌더러 프로세스와 같이 임의의 사용자 입력을 처리하는 프로세스의 경우 임의의 파일 액세스를 제한합니다.

운영체제의 권한 제한 기능: 운영체제는 각 프로그램이 무엇을 할 수 있는지(예: 파일 접근, 네트워크 사용 등)를 제한할 수 있습니다.

브라우저의 샌드박스 적용: 크롬 브라우저는 이 기능을 이용해 특정 작업을 수행하는 프로세스에 대해 필요한 권한만 부여합니다. 샌드박스는 프로세스가 할 수 있는 일을 제한하는 일종의 '안전 구역'입니다.

예시: 렌더러 프로세스

웹페이지를 표시하고 사용자 입력(클릭, 키 입력 등)을 처리하는 프로세스입니다. 예를들면 크롬은 렌더러 프로세스가 임의로 파일에 접근하지 못하도록 제한합니다.

메모리 절약

성능 (Performance)

Chrome은 브라우저 프로그램의 각 부분을 서비스로 실행하여 여러 프로세스로 분할하거나 하나로 집계할 수 있도록 아키텍처를 변경하고 있습니다. 일반적으로 Chrome이 강력한 하드웨어에서 실행될 때는 각 서비스를 여러 프로세스로 분할하여 안정성을 높일 수 있지만, 리소스 제약이 있는 기기의 경우에는 Chrome이 서비스를 하나의 프로세스로 통합하여 메모리 공간을 절약합니다. 메모리 사용량을 줄이기 위해 프로세스를 통합하는 유사한 접근 방식이 이번 변경 전에 Android와 같은 플랫폼에서 사용되었습니다.

사이트 격리

사이트 격리는 최근 Chrome에 도입된 기능입니다. 크롬 브라우저의 보안 기능으로 각 교차 사이트 iframe에 별도의 렌더러 프로세스를 실행합니다 이렇게 하면 한 사이트에서 다른 사이트의 데이터에 접근하지 못하도록 방지할 수 있습니다.

동일 출처 정책

이 정책은 한 사이트가 다른 사이트의 데이터에 동의 없이 접근하지 못하도록 막는 웹 보안의 핵심입니다. 하지만 같은 프로세스에서 실행되면 이 정책을 우회하는 보안 공격이 가능할 수 있습니다. 멜트다운(Meltdown)과 스펙터(Spectre) 같은 보안 공격은 이러한 취약점을 노립니다. 한 사이트에서 다른 사이트의 데이터에 접근할 수 있는 가능성을 높입니다.

사이트 격리

각 교차 사이트 iframe에 별도의 렌더러 프로세스를 할당하여 한 사이트가 다른 사이트의 데이터를 접근하지 못하게 합니다. 예를 들어 a.com의 iframe에 b.com이 표시될 때 b.com은 별도의 프로세스에서 실행됩니다.

마무리

브라우저 멀티 프로세스 아키텍처를 살펴보았습니다. 또한 다중 프로세스 아키텍처와 밀접한 관련이 있는 Chrome의 서비스 및 사이트 격리에 관해서도 알아보았습니다.

이번 글은 기술블로거 모여라! 스터디의 세번째 글입니다. 저와 다른 스터디원 한 분을 제외하고 모두 프론트엔드 개발자가 아닌지라 이번에는 어떤 주제로 글을 쓸지 고민했습니다. 예전에 브라우저 렌더링 글에 대해 작성한 적이 있었는데 크롬 브라우저 멀티 프로세스에 대한 내용이 많이 생략 된 것 같아 해당 주제를 채택하게 됐습니다.

렌더링 글은 여기에서 확인해주세요.

레퍼런스

https://developer.chrome.com/blog/inside-browser-part1?hl=ko
https://tech.ktcloud.com/17
https://velog.io/write
https://dar0m.tistory.com/233