JavaScript 는 웹 브라우저에서 사용하기 위하여 만들어진 프로그래밍 언어
HTML은 크게 head와 body로 구성되며, head안에는 페이지의 속성 정보가, body안에는 페이지의 내용이 들어있습니다.
meta, script, link, title 등div, p, img 등요소 : attribute
https://developers.google.com/web/updates/2018/09/inside-browser-part1?hl=ko#cpu_gpu_memory_그리고_멀티_프로세스_아키텍쳐
브라우저 아키텍처를 파악하기 전에 프로스세와 스레드 원리를 이해해야 합니다. 프로세스는 어플리케이션의 실행 프로그램이며, 스레드는 프로세스 내부에 있으며 프로세스의 프로그램을 실행하는 주체입니다.
어플리케이션을 시작하면 프로세스가 생성됩니다. 프로그램은 작업을 위해 스레드(들)을 생성할 수도 있습니다. OS는 프로세스에 메모리 한 "조각"을 줘서 어플리케이션의 모든 상태 정보를 고유 메모리 공간에 저장할 수 있게 합니다. 어플리케이션을 종료하면 프로세스도 사라지고 OS가 메모리를 해제합니다.
프로세스는 다른 프로세스를 돌려서 별도의 작업을 수행하도록 OS에 요청할 수 있습니다. 이렇게 되면 OS는 별도의 메모리 공간을 새 프로세스에 할당하죠. 두 프로세스간 통신이 필요하다면 Inter Process Communication (IPC)을 이용합니다.
그래서 웹 브라우저는 프로스세와 스레드를 이용해 어떻게 동작할까요? 뭐, 한 프로세스가 스레드를 왕창 들고 있거나 스레드 몇 개 가진 다수의 프로세스들이 IPC를 통해 통신하겠죠.
최상위의 브라우저 프로세스는 어플리케이션의 다른 부분을 담당하는 프로세스들을 조율합니다. 렌더 프로세스는 다수의 프로세스가 생성되어 각 탭마다 할당됩니다. 극히 최근까지 크롬은 가능하면 각 탭마다 별도의 프로세스를 할당하였습니다. 이제는 iframe을 포함하여 각 사이트 별로 프로세스를 가지도록 변경되었습니다.
크롬이 고성능 장치에서 실행될 때에는 안정성을 위해 각 서비스를 별개의 프로세스로 분리하고, 자원이 부족한 장치에서는 서비스를 하나의 프로세스로 합쳐 메모리 점유를 낮추는 것입니다. 이렇게 변경하기 전부터 이미 안드로이드와 같은 플랫폼에서는 유사하게 프로세스를 합쳐 메모리 점유를 줄이는 방식을 사용하고 있었습니다.
브라우저 : 주소 창, 뒤로 및 앞으로 이동 버튼을 포함한 어플리케이션의 "chrome" 부분을 제어합니다. 또한 네트워크 요청 및 파일 액세스와 같은 웹 브라우저의 권한이 부여된 보이지 않는 부분을 제어합니다. UI 쓰레드, 네트워크 쓰레드, 스토리지 스레드 등을 가지고 있다.
렌더러 : 웹사이트가 디스플레이 될 때 탭 안의 모든 것 담당.
GPU : 다른 프로세스와 분리된 GPU 작업을 제어합니다. GPU는 여러 앱의 요청을 제어하고 동일한 표면에 표시하기 때문에 다른 프로세스로 분리됩니다.
플러그인 : 플래시와 같은 웹사이트가 사용하는 모든 플러그인 담당.