Electron 的核心架构

Electron 应用基于 Chromium 和 Node.js 构建，采用多进程架构。主进程负责管理应用生命周期和原生操作系统交互，渲染进程负责展示网页内容。每个渲染进程独立运行，确保崩溃时不影响其他窗口。

主进程（Main Process）

主进程是 Electron 应用的入口点，通过 main.js 文件启动。它拥有完整的 Node.js 环境权限，可调用所有 Node.js API 和 Electron 提供的模块（如 app、BrowserWindow）。主进程负责创建和管理渲染进程窗口，处理系统级事件（如文件操作、菜单栏、托盘图标）。

典型的主进程任务包括：

• 使用 BrowserWindow 创建和管理浏览器窗口
• 通过 ipcMain 模块监听渲染进程的 IPC 通信请求
• 调用 dialog 模块显示原生系统对话框
• 管理应用生命周期事件（如 ready、window-all-closed）

渲染进程（Renderer Process）

每个 Electron 窗口对应一个独立的渲染进程，运行在 Chromium 渲染引擎中。默认情况下，渲染进程只能访问浏览器环境和有限的 Electron API（如 ipcRenderer）。若需启用 Node.js 集成，需在创建窗口时配置 webPreferences: { nodeIntegration: true }。

渲染进程的特性：

• 每个窗口拥有独立的沙盒环境，崩溃时不影响其他窗口
• 默认禁用 Node.js 集成，需显式配置以访问 fs 等模块
• 通过 preload 脚本可安全地暴露特定 API 给网页

进程间通信（IPC）

Electron 通过 ipcMain 和 ipcRenderer 模块实现进程间通信。通信基于事件驱动模式，支持同步和异步消息传递。

基础 IPC 模式：

// 主进程中监听
const { ipcMain } = require('electron')
ipcMain.on('async-msg', (event, arg) => {
  console.log(arg) // 输出 "ping"
  event.reply('async-reply', 'pong')
})

// 渲染进程中发送
const { ipcRenderer } = require('electron')
ipcRenderer.send('async-msg', 'ping')
ipcRenderer.on('async-reply', (event, arg) => {
  console.log(arg) // 输出 "pong"
})

高级通信方案：

• 上下文隔离（Context Isolation）： 通过 contextBridge 安全暴露 API

  // preload.js
  const { contextBridge, ipcRenderer } = require('electron')
  contextBridge.exposeInMainWorld('electronAPI', {
    send: (channel, data) => ipcRenderer.send(channel, data)
  })
  

• 远程模块（Remote Module）： 不推荐使用，已被标记为废弃
• 共享内存： 通过 SharedArrayBuffer 实现高性能数据交换

安全实践

• 禁用 nodeIntegration 时优先使用 preload 脚本暴露必要功能
• 启用 contextIsolation 防止原型污染攻击
• 对渲染进程接收的 IPC 消息进行验证
• 使用 sandbox 模式限制渲染进程权限

调试工具

主进程可通过 --inspect 参数启动调试：

electron --inspect=9229 main.js

渲染进程可使用 Chrome DevTools 进行调试，通过 webContents.openDevTools() 自动开启开发者工具。

性能优化

• 使用 webFrame.setVisualZoomLevelLimits(1, 1) 禁用页面缩放
• 对频繁通信的数据采用二进制格式（如 Protocol Buffers）
• 多个窗口复用同一个渲染进程时，配置 webPreferences: { partition: 'persist:name' }