How web browsers use process & Threads
In this article, we’ll look inside the Chrome browser and Firefox browser. If you ever wondered how the browser turns your code into a functional website, or you are unsure why a specific technique is suggested for performance improvements.
Let’s take a few minutes to delve into the process and threads.
Processes and threads
The Process and Thread are the essentially associated. The process is an execution of a program whereas thread is an execution of a program driven by the environment of a process.
How Processes Work
The process is the execution of a program and performs the relevant actions specified in a program, or it is an execution unit where a program runs. The operating system creates, schedules and terminates the processes for the use of the CPU. The other processes created by the main process are known as child process.
How Threads Work
The thread is a program execution that uses process resources for accomplishing the task. All threads within a single program are logically contained within a process. The kernel allocates a stack and a thread control block (TCB) to each thread. The operating system saves only the stack pointer and CPU state at the time of switching between the threads of the same process.
Executing program on Process and Thread
When you start an application, a process is created. The program might create thread(s) to help it do work, but that’s optional. The Operating System gives the process a “slab” of memory to work with and all application state is kept in that private memory space. When you close the application, the process also goes away and the Operating System frees up the memory.
A process can ask the Operating System to spin up another process to run different tasks. When this happens, different parts of the memory are allocated for the new process. If two processes need to talk, they can do so by using Inter Process Communication (IPC). Many applications are designed to work this way so that if a worker process get unresponsive, it can be restarted without stopping other processes which are running different parts of the application.
Browser Architecture
So how is a web browser built using processes and threads? Well, it could be one process with many different threads or many different processes with a few threads communicating over IPC.
Let’s take the Chrome browser and Firefox browser and see about the multi-process architecture.
How Google chrome use Processes and Threads
Which process controls what?
The following describes each Chrome process and what it controls:
Process and What it controls
Browser: Controls “chrome” part of the application including address bar, bookmarks, back and forward buttons.
Also handles the invisible, privileged parts of a web browser such as network requests and file access.
Renderer: Controls anything inside of the tab where a website is displayed.
Plugin: Controls any plugins used by the website, for example, flash.
GPU: Handles GPU tasks in isolation from other processes. It is separated into different process because GPUs handles requests from multiple apps and draw them in the same surface.
How Firefox use Processes and Threads
Firefox was a single-process browser. It easily freezes the UI, and it might not be optimal from a security point of view, either. Then Firefox started to work on multi-process architecture in a project called Electrolysis and it implemented it through nine versions.
Firefox also using the concepts of multi-threading inside each process. With the release of Firefox 54, Mozilla has completed its transition to a multi-threaded web browser. But the multi-threading concept in Firefox is bit different with that of Chrome. In Chrome it initialize separate process for each tabs. If 5 tabs are opened, then there will be 5 render processes running. It will result it consuming memory, when the no. of processes get increased.
