Моделирование процесса
Electron наследует концепцию множественных процессов от Chromium, что делает фреймворк похожим по архитектуре на современный веб-браузер. Это руководство расширяет понятия, приведенные в Учебном материале.
Почему недостаточно одного процесса?
Веб-браузеры являются крайне сложными приложениями. Помимо основной задачи - отображать веб-содержимое, они выполняют множество второстепенных функций, таких как управление множеством окон (или вкладок) и загрузка сторонних расширений.
Раньше браузеры, как правило, использовали один процесс для всех этих функций. Несмотря на то, что такая схема позволяла снизить нагрузку при работе каждой открытой вкладки, это также означало, что сбой или зависание одного веб-сайта сказывалось на работе всего браузера.
Модель множественных процессов
Чтобы решить эту проблему, команда разработчиков Chrome решила, что каждая вкладка будет выполняться в отдельном процессе, что позволит ограничить риск влияния ошибок или вредоносного кода веб-страницы на всё приложение сразу. Затем отдельный процесс браузера контролирует все эти процессы, включая жизненный цикл приложения в целом. Приведенная ниже диаграмма из Chrome Comic наглядно демонстрирует эту модель:
Приложения работающие на Electron устроены примерно так же. Как разработчик, вы управляете двумя типами процессов: main и renderer. Они аналогичны вышеописанным процессу браузера и отображения в Chrome.
Основной процесс (main
)
Каждое приложение Electron имеет один основной процесс, который является точкой входа в приложение. Основной процесс работает в среде Node.js, то есть имеет возможность импортировать (require
) модули и использовать весь функционал API Node.js.
Управление окнами
Основными задачами главного процесса являются создание и управление окнами приложений с помощью модуля BrowserWindow
.
Каждый экземпляр класса BrowserWindow
создает окно приложения, которое загружает веб-страницу в отдельном процессе рендеринга. Взаимодействовать с содержимым веб-страницы можно из основного процесса, используя объект webContents
окна.
const { BrowserWindow } = require('electron')
const win = new BrowserWindow({ width: 800, height: 1500 })
win.loadURL('https://github.com')
const contents = win.webContents
console.log(contents)
Примечание: Процесс рендеринга создается также для встраиваемого веб-содержимого, например, модуля
BrowserView
. ОбъектwebContents
также доступен и для такого содержимого.
Поскольку модуль BrowserWindow
представляет из себя EventEmitter
, в него также можно добавить обработчики различных пользовательских событий (например: сворачивание или разворачивание окна).
При завершении экземпляра BrowserWindow
завершается и соответствующий ему процесс рендера.