开源软件

Electron:使用 JavaScript 构建跨平台桌面应用程序

Electron 是一个使用 JavaScript、HTML 和 CSS 构建跨平台桌面应用程序的框架,为 VS Code、Slack 和 Discord 提供支持。

Keeping this site alive takes effort — your support means everything.
無程式碼也能輕鬆打造專業LINE官方帳號!一鍵導入模板,讓AI助你行銷加分! 無程式碼也能輕鬆打造專業LINE官方帳號!一鍵導入模板,讓AI助你行銷加分!
Electron:使用 JavaScript 构建跨平台桌面应用程序

桌面应用程序的格局已被一个简单的洞察所改变:如果你能用驱动互联网的相同 Web 技术来构建原生质量的桌面应用程序呢?Electron 将这个愿景变为现实,并在此过程中成为现代桌面软件开发的支柱。

Electron 是一个将 Chromium 的渲染引擎与 Node.js 运行时相结合的开源框架,让开发者能够使用 JavaScript、HTML 和 CSS 构建跨平台桌面应用程序。最初由 GitHub 为 Atom 编辑器创建,Electron 后来移交给 OpenJS Foundation,并已成为最具影响力的开源项目之一。

数字令人惊叹:Electron 为 Visual Studio Code(每月超过 1 亿用户)、Slack、Discord、Figma、Notion、WhatsApp Desktop、Signal、Microsoft Teams 以及成千上万其他应用程序提供支持。它让无数初创公司能够在维护 Web 产品的同时发布桌面应用程序,而无需维护单独的原生代码库。


Electron 的架构如何工作?

Electron 的架构建立在继承自 Chromium 的多进程模型之上,有两种主要进程类型协同工作。

graph TD
    A[主进程\nNode.js 运行时] --> B[BrowserWindow 1\nChromium 渲染进程]
    A --> C[BrowserWindow 2\nChromium 渲染进程]
    A --> D[BrowserWindow N\nChromium 渲染进程]
    B --> E[IPC: ipcMain / ipcRenderer]
    C --> E
    D --> E
    E --> F[主进程处理器\n文件系统、原生 API]
    A --> G[系统托盘]
    A --> H[原生菜单]
    A --> I[Dock / 任务栏]

主进程以完整的 Node.js 环境运行,管理应用程序生命周期、原生菜单、系统托盘和 IPC(进程间通信)。每个渲染进程是一个独立的 Chromium 实例,显示 HTML/CSS/JavaScript 用户界面。这种分离提供了性能隔离和安全边界。


哪些应用程序使用 Electron 构建?

Electron 的采用范围涵盖整个软件行业,从开发者工具到通信平台再到创意套件。

应用程序类别用户 / 影响
Visual Studio Code代码编辑器每月超过 1 亿活跃用户
Slack团队通信每日超过 1000 万活跃用户
Discord语音/文字聊天每月超过 1.5 亿活跃用户
Figma Desktop设计超过 400 万用户(混合 Web + 桌面)
Signal Desktop加密消息每月超过 4000 万活跃用户
Notion Desktop生产力超过 3000 万用户

如此多样化用例的广泛采用,证明了 Electron 从轻量级聊天应用程序到高性能代码编辑器的多功能性。


Electron 有哪些关键 API 和功能?

Electron 提供了一套全面的 API,弥合了 Web 应用程序和原生桌面功能之间的差距。

API 类别示例说明
窗口管理BrowserWindow、无边框窗口原生窗口控制、透明窗口、毛玻璃效果
操作系统集成Tray、Notification、Menu、Shell系统托盘图标、原生通知、上下文菜单
文件系统dialog.showOpenDialog、net.request原生文件对话框、HTTP 请求、协议处理器
硬件desktopCapturer、screen屏幕录制、显示信息、媒体访问
系统app、process、clipboard应用程序生命周期、剪贴板访问、环境检测

这些 API 可通过 Electron 的 IPC 系统访问,该系统使用 ipcMainipcRenderer 在主进程和渲染进程之间提供安全、结构化的通信。


Electron 的安全最佳实践是什么?

Electron 应用程序的安全性遵循纵深防御方法,认识到渲染进程是潜在不可信的环境。

实践实现方式
上下文隔离在 BrowserWindow 选项中设置 contextIsolation: true
Node 集成在渲染进程中设置 nodeIntegration: false(自 v5 起的默认值)
内容安全策略限制脚本来源的 HTTP 头
IPC 验证始终在主进程上验证 IPC 消息负载
沙箱为不受信任的内容启用渲染进程沙箱 sandbox: true

遵循这些实践可确保即使渲染进程遭到入侵(例如通过恶意的第三方脚本),攻击者也无法直接访问 Node.js API 或操作系统。


常见问题

什么是 Electron? Electron 是由 OpenJS Foundation 开发的开源框架,用于使用 Web 技术构建跨平台桌面应用程序。它结合了 Chromium 的渲染引擎与 Node.js 运行时。

有哪些主要应用程序使用 Electron 构建? Electron 为 Visual Studio Code、Slack、Discord、Postman、Figma、Notion、WhatsApp Desktop、Signal、GitHub Desktop、Microsoft Teams 等提供支持。

Electron 与其他跨平台框架有何不同? 与原生框架或其他跨平台解决方案不同,Electron 使用 Web 技术,每个窗口使用一个完整的 Chromium 浏览器实例。

Electron 的安全模型是什么? Electron 使用多进程架构,最佳实践包括启用上下文隔离、禁用渲染进程中的 Node.js 集成等。

Electron 应用程序可以访问原生 API 吗? 是的,Electron 提供系统托盘、通知、文件系统访问、Shell 集成、剪贴板访问等 API。


延伸阅读

TAG
CATEGORIES