CPU, GPU, 메모리, 멀티 프로세스 아키텍처
총 4부로 구성된 이 블로그 시리즈에서는 Chrome 브라우저의 내부를 개략적으로 살펴보고 자세히 알아보겠습니다 브라우저가 코드를 제대로 작동하는 웹사이트가 있거나, 특정 기술이 성능을 위해 제안되는 이유를 잘 모르겠음 이 시리즈가 도움이 될 것입니다
이 시리즈에서는 핵심 컴퓨팅 용어와 Chrome의 멀티 프로세스 아키텍처를 기반으로 합니다.
컴퓨터의 핵심에는 CPU와 GPU가 있습니다.
브라우저가 실행되는 환경을 이해하려면 그들이 하는 일을 배웠습니다.
CPU
<ph type="x-smartling-placeholder">
<ph type="x-smartling-placeholder">첫 번째는 중앙 프로세싱 유니트 또는 CPU입니다. CPU는 작동한다는 것입니다. 여기에서 사무실 직원 그림으로 표현된 CPU 코어는 다양한 작업을 처리할 수 있습니다. 하나씩 수집됩니다. 수학에서 예술에 이르기까지 모든 것을 처리할 수 있으며 대답하는 방법을 알고 있습니다. 연결할 수 있습니다 과거에는 대부분의 CPU가 단일 칩이었습니다. 코어는 CPU에 살고 있는 다른 CPU와 동일한 칩입니다. 최신 하드웨어에서는 코어를 두 개 이상 사용하여 더 많은 컴퓨팅 성능을 제공하는 경우가 많습니다. 전송할 수 있습니다.
GPU
<ph type="x-smartling-placeholder">
<ph type="x-smartling-placeholder">레이싱 프로세싱 Unit 또는 GPU는 컴퓨터의 또 다른 부분입니다. CPU와 달리 GPU는 여러 코어에서 동시에 간단한 작업을 처리하는 데 적합합니다. 이름 알 수 있듯이 그래픽을 처리하기 위해 처음 개발되었습니다. 이러한 이유로 그래픽의 맥락에서 "GPU 사용" 또는 'GPU 지원' 빠른 렌더링과 원활한 상호작용과 관련이 있습니다. 최근 몇 년 동안 GPU 가속 컴퓨팅으로 인해 점점 더 많은 컴퓨팅이 가능해지고 있습니다. GPU만 사용할 수 있습니다.
컴퓨터나 휴대전화에서 애플리케이션을 시작할 때는 CPU와 GPU가 지정할 수 있습니다 일반적으로 애플리케이션은 CPU 및 GPU에서 실행되는 메커니즘이 있는 운영체제.
<ph type="x-smartling-placeholder">
<ph type="x-smartling-placeholder">프로세스 및 스레드에서 프로그램 실행
<ph type="x-smartling-placeholder">
<ph type="x-smartling-placeholder">브라우저 아키텍처를 시작하기 전에 알아야 할 또 다른 개념은 프로세스와 스레드입니다. 프로세스는 애플리케이션의 실행 프로그램으로 설명할 수 있습니다. 대화목록은 프로세스의 모든 부분을 실행합니다.
애플리케이션을 시작하면 프로세스가 만들어집니다. 프로그램은 문제를 해결하기 위해 스레드를 만들 수 있습니다. 이는 선택사항입니다. 운영 체제는 프로세스에 "슬래브"를 제공합니다. 메모리의 양과 모든 애플리케이션 상태는 해당 비공개 메모리 공간에 유지됩니다. Google Cloud 콘솔의 그 프로세스도 사라지고 운영 체제가 메모리를 확보합니다.
<ph type="x-smartling-placeholder">
<ph type="x-smartling-placeholder">프로세스는 다른 작업을 실행하기 위해 운영 체제에 다른 프로세스를 시작하도록 요청할 수 있습니다. 이 메모리의 다른 부분이 새 프로세스에 할당됩니다. 두 프로세스가 인터 프로세스 커뮤니케이션 (IPC)을 통해 이를 수행할 수 있습니다. 다양한 애플리케이션 이러한 방식으로 작동하도록 설계되었으므로 작업자 프로세스가 응답하지 않을 경우 다시 시작할 수 있습니다. 애플리케이션의 다른 부분을 실행 중인 다른 프로세스를 중지하지 않아도 됩니다.
<ph type="x-smartling-placeholder">
<ph type="x-smartling-placeholder">브라우저 아키텍처
그렇다면 웹 브라우저는 프로세스와 스레드를 사용하여 어떻게 빌드될까요? 하나의 프로세스일 수도 있고 다른 스레드 또는 IPC를 통해 통신하는 몇 개의 스레드가 있는 많은 다른 프로세스.
<ph type="x-smartling-placeholder">
<ph type="x-smartling-placeholder">여기서 중요한 점은 이러한 다양한 아키텍처가 구현 세부정보라는 것입니다. 웹브라우저 빌드 방법에 대한 표준 사양은 없습니다. 한 브라우저의 접근 방식은 다른 것과 완전히 다릅니다.
이 블로그 시리즈에서는 Chrome의 최신 아키텍처인 설명됩니다.
맨 위에는 서로 다른 애플리케이션의 일부분에 대해 설명할 수 있습니다 렌더기 프로세스의 경우 여러 프로세스가 생성되어 확인할 수 있습니다 아주 최근까지 Chrome은 가능한 경우 각 탭에 프로세스를 제공했습니다. 이제 인코더-디코더 아키텍처를 iframe을 포함한 각 사이트 자체 프로세스 (사이트 격리 참고)
<ph type="x-smartling-placeholder">
<ph type="x-smartling-placeholder">어떤 프로세스가 무엇을 제어하나요?
다음 표에서는 각 Chrome 프로세스와 제어 항목을 설명합니다.
| 프로세스 및 제어 대상 | |
|---|---|
| 브라우저 |
'chrome' 제어 애플리케이션의 일부분(주소 표시줄, 북마크, 뒤로 버튼)과
전달 버튼 웹브라우저에서 보이지 않는 권한이 있는 부분도 처리합니다. 네트워크 요청 및 파일 액세스가 포함됩니다. |
| 렌더기 | 웹사이트가 표시되는 탭 내부의 모든 요소를 제어합니다. |
| 플러그인 | 웹사이트에서 사용하는 플러그인(예: 플래시)을 제어합니다. |
| GPU | GPU 작업을 다른 프로세스와 별도로 처리합니다. 다른 프로세스로 분리됩니다 GPU가 여러 앱의 요청을 처리하고 동일한 노출 영역에 그리기 때문입니다. |
<ph type="x-smartling-placeholder">확장 프로그램 프로세스 및 유틸리티 프로세스와 같은 훨씬 더 많은 프로세스가 있습니다. 예를 들어 Chrome에서 실행 중인 프로세스 수를 확인하려면 옵션 메뉴 아이콘 오른쪽 상단에서 아이콘을 탭한 다음 '도구 더보기'를 선택합니다. 작업 관리자를 선택합니다. 그러면 현재 실행 중인 프로세스 목록이 있는 창이 열립니다. CPU/메모리 양을 표시합니다
Chrome의 멀티 프로세스 아키텍처의 이점
앞서 Chrome이 여러 렌더기 프로세스를 사용한다고 언급했습니다. 가장 간단한 경우 각 탭에 자체 렌더기 프로세스가 있다고 가정해 보겠습니다. 3개의 탭이 열려 있고 각 탭이 사용하여 렌더링됩니다.
탭 하나가 응답하지 않으면 응답하지 않는 탭을 닫고 다른 탭이 살아있는 것을 볼 수 있습니다. 모든 탭이 한 프로세스에서 실행 중인 경우 한 탭이 응답하지 않으면 모든 탭이 탭이 응답하지 않습니다. 안타깝네.
<ph type="x-smartling-placeholder">
<ph type="x-smartling-placeholder">브라우저의 작업을 여러 프로세스로 분리하는 것의 또 다른 이점은 보안과 있습니다. 운영 체제는 프로세스를 제한하는 방법을 제공하기 때문에 브라우저 권한, 브라우저 권한, 특정 기능에서 특정 프로세스를 샌드박스 처리할 수 있습니다. 예를 들어 Chrome 브라우저는 렌더기 프로세스와 같이 임의의 사용자 입력을 처리하는 프로세스에 대한 임의 파일 액세스
프로세스에는 자체 비공개 메모리 공간이 있기 때문에 일반적인 인프라 (예: Chrome의 JavaScript 엔진인 V8)를 지원합니다. 따라서 메모리 사용량이 같은 프로세스 내의 스레드인 경우와 같이 공유할 수 없습니다. Chrome은 메모리를 절약하기 위해 실행할 수 있는 프로세스 수에 한도를 둡니다. 한도는 기기의 메모리와 CPU 성능에 따라 달라지지만 한도를 초과하면 한 프로세스에서 같은 사이트의 여러 탭을 실행하기 시작합니다.
더 많은 메모리 절약 - Chrome의 서비스
브라우저 프로세스에도 동일한 접근 방식이 적용됩니다. Chrome의 아키텍처 변경 중 브라우저 프로그램의 각 부분을 서비스로 실행함으로써 서로 다른 프로세스로 분할할 수 있습니다. 하나로 취합할 수 있습니다
일반적으로 Chrome이 강력한 하드웨어에서 실행되는 경우 각 서비스를 여러 프로세스를 통해 안정성이 더 높아질 수 있지만, 리소스가 제한된 기기에서 실행된다면 Chrome은 서비스를 하나의 프로세스로 통합하여 메모리 공간을 절약합니다. 데이터를 통합하는 것과 유사한 이러한 변경 전에는 Android와 같은 플랫폼에서 메모리 사용량을 줄이기 위한 프로세스가 사용되었습니다.
<ph type="x-smartling-placeholder">
<ph type="x-smartling-placeholder">프레임당 렌더기 프로세스 - 사이트 격리
사이트 격리는 최근에 각 교차 사이트 iframe마다 별도의 렌더기 프로세스를 실행하는 Chrome에 도입된 기능입니다. 지금까지는 탭 모델당 하나의 렌더기 프로세스로 교차 사이트 및 여러 사이트 간에 메모리 공간을 공유하는 단일 렌더러 프로세스에서 실행되는 iframe입니다. 동일한 렌더기 프로세스에서 a.com과 b.com을 실행하는 것은 괜찮아 보일 수 있습니다. 동일 출처 정책 웹의 핵심 보안 모델입니다. 한 사이트가 다른 사이트의 데이터에 액세스할 수 없도록 합니다. 할 수 있습니다. 이 정책을 우회하는 것이 보안 공격의 주요 목표입니다. 프로세스 격리는 사이트를 분리하는 가장 효과적인 방법입니다. 다음으로 바꿉니다. 멜트다운과 스펙터, 프로세스를 사용하여 사이트를 분리해야 한다는 것이 훨씬 더 분명해졌습니다. Chrome 67부터 데스크톱에서 사이트 격리가 기본적으로 사용 설정되어 있어 탭의 각 교차 사이트 iframe이 별도의 렌더기 프로세스를 가져옵니다.
<ph type="x-smartling-placeholder">
<ph type="x-smartling-placeholder">사이트 격리를 사용 설정하려면 수년간의 엔지니어링 작업이 이루어져 왔습니다. 사이트 격리는 여러 렌더러 프로세스 할당 iframe이 각 레이어와 통신하는 방식이 근본적으로 있습니다. iframe이 다른 프로세스에서 실행 중인 페이지에서 devtools를 열면 devtools가 매끄럽게 보이도록 백그라운드 작업을 구현합니다. 간단한 Ctrl+F를 실행하여 여러 렌더러 프로세스에서 검색하는 것을 의미합니다. 그 이유를 볼 수 있습니다. 브라우저 엔지니어들이 사이트 격리의 출시에 대해 중대한 이정표라고 이야기합니다.
마무리
이 글에서는 브라우저 아키텍처를 개략적으로 살펴봤으며 멀티 프로세스 아키텍처를 기반으로 합니다. 또한 Chrome의 서비스 및 사이트 격리에 관해서도 밀접한 관련이 있습니다. 다음 게시물에서는 어떤 일이 발생하는지 확인해야 합니다.
게시물이 마음에 드셨나요? 향후 게시물에 관한 질문이나 제안이 있으면 Twitter에서 @kosamari로 전해 주세요.