进程模型

Electron 不是普通 Web 页面，也不是普通 Node.js 程序。它同时包含 Chromium 多进程模型和 Node.js 运行时。

主进程

主进程是 Electron 应用的入口，负责管理应用生命周期和系统级能力。

常见职责：

• 创建和管理 BrowserWindow。
• 管理菜单、托盘、快捷键、剪贴板、通知。
• 访问文件系统、数据库、本地服务和原生模块。
• 注册 IPC handler，向渲染进程提供受控能力。
• 处理应用退出、重启、单实例锁等生命周期逻辑。

主进程数量通常只有一个。

渲染进程

每个窗口或 WebView 通常对应一个渲染进程。渲染进程负责页面 UI，与浏览器页面更接近。

常见职责：

• 渲染 React、Vue、Svelte 等前端应用。
• 处理用户交互和页面状态。
• 通过 preload 暴露的 API 请求主进程能力。

渲染进程不应该直接访问数据库、文件系统或 Node.js 模块。

Preload

Preload 脚本运行在渲染进程加载页面之前，但可以访问有限的 Electron 和 Node.js 能力。

它的作用是把主进程能力包装成受控 API 暴露给页面：

import { contextBridge, ipcRenderer } from 'electron'

contextBridge.exposeInMainWorld('appApi', {
  version: () => ipcRenderer.invoke('app:version'),
})

渲染进程只调用：

const version = await window.appApi.version()

不要把 ipcRenderer、require、process 直接暴露给页面。

数据流

典型数据流：

renderer -> preload -> ipcRenderer.invoke -> ipcMain.handle -> service -> resource

例如读取本地配置：

页面点击按钮
  -> window.appApi.settings.get()
  -> ipcRenderer.invoke('settings:get')
  -> ipcMain.handle('settings:get')
  -> 主进程读取文件或数据库
  -> 返回序列化后的结果

进程边界

进程边界是 Electron 项目最重要的设计约束。

• UI 状态放在渲染进程。
• 系统资源访问放在主进程。
• 跨边界通信通过明确的 IPC channel。
• 数据必须可序列化，不传递函数、类实例、数据库连接等对象。
• 慢任务不要阻塞主进程；需要时拆到子进程、Worker 或后台任务。