Electron concept study-Process Model

This is my notes on https://www.electronjs.org/docs/latest/tutorial/process-model, and not a complete summary

why is election multi-process? web browsers like chrome are multi-process. Each tab, ui, plugin is a process. Explained very well in this Chrome Comic I liked.

So an electron app has a single main process that runs in node.js. This is the entrypoint, and can require and use all of node.js APIs. so it can read, write stuff anywhere. high level permission

This main process creates an app window using BrowserWindowmodule.
like,

// main.js
const { BrowserWindow } = require('electron')

const win = new BrowserWindow({ width: 800, height: 1500 })
win.loadURL('https://github.com')

const contents = win.webContents
console.log(contents)

This provides apps with a renderer, kind of like Chromium wrapper.

• Also, for security reasons explained well in the Chrome Comic, these renderers have very little privilege. It cannot use node.js APIs to control the native machine or other renderes, or require other modules. To use npm modules in rederer, you need to use same bundler toolchains like webpack or parcel to build the binary in beforehand.

Or you can use preload scripts, which are run in a global Window interface. This can access node.js APIs.

or use utility process using UtilityProcess api, which can use use node.js and npm modules

moreover, electron has Native APIs to control native desktop functionality like menus, dialogs, tray icns.