跳转到主要内容

Electron 40.0.0

·阅读时长 5 分钟

Electron 40.0.0 已发布!它包括对 Chromium 144.0.7559.60、V8 14.4 和 Node 24.11.1 的升级。


Electron 团队很高兴地宣布 Electron 40.0.0 的发布!您可以使用 npm 通过 npm install electron@latest 安装它,或从我们的 发布网站 下载它。继续阅读以了解此版本的详细信息。

如果您有任何反馈,请在 BlueskyMastodon 上与我们分享,或加入我们的社区 Discord!错误和功能请求可以在 Electron 的 问题跟踪器 中报告。

技术谈话:改进窗口调整大小行为

·阅读时长 16 分钟

我们正在启动一个新的博客文章系列,分享我们在 Electron 上的工作进展。如果您对这项工作感兴趣,请考虑 贡献


最近,我致力于改进 Electron 和 Chromium 的窗口调整大小行为。

这个错误

我们在 Windows 上遇到一个问题,即在调整窗口大小时,旧的框架会变得可见。

Animated GIF showing the issue where old frames would be shown while resizing windows

是什么让这个错误特别有趣?

  1. 它极具挑战性。
  2. 它隐藏在一个庞大的代码库中。
  3. 如您稍后将看到,底层存在两个不同的错误。

修复这个错误

对于这类错误,首要挑战是确定从哪里开始查找。

Electron 构建于 Chromium 之上,它是 Google Chrome 的开源版本。在编译 Electron 时,Electron 的源代码会作为子目录添加到 Chromium 源代码树中。然后,Electron 依赖 Chromium 的代码来提供现代浏览器的绝大部分功能。

Chromium 拥有大约 3600 万行代码。Electron 本身也是一个大型项目。这其中可能隐藏着导致此问题的代码。

十二月平静的一个月 (12月25日)

·3 分钟阅读

从 12 月 1 日开始,Electron 项目将进入一个安静期,并在 2026 年 1 月恢复到全力运行。有关完整详细信息,请参阅下面的 政策 部分。

自 2020 年以来,12 月一直是项目维护者从常规维护工作中抽身休息或专注于深入工作的时期。这种休息有助于我们恢复精力,为来年做好准备。

也就是说,像这样为期一个月的暂停只有在开源项目处于健康状态时才能实现——我们感谢所有维护者和外部贡献者为保持项目进展所做的持续努力。❤️

Electron 39.0.0

·阅读时长 4 分钟

Electron 39.0.0 已发布!它包括对 Chromium 142.0.7444.52、V8 14.2 和 Node 22.20.0 的升级。


Electron 团队很高兴地宣布 Electron 39.0.0 的发布!您可以使用 npm 通过 npm install electron@latest 安装它,或从我们的 发布网站 下载它。继续阅读以了解此版本的详细信息。

如果您有任何反馈,请在 BlueskyMastodon 上与我们分享,或加入我们的社区 Discord!错误和功能请求可以在 Electron 的 问题跟踪器 中报告。

值得注意的变化

ASAR 完整性已升级到稳定版

一个长期存在的“实验性”功能——ASAR 完整性——现在在 Electron 39 中稳定了。当您启用此功能时,它会在运行时根据构建时哈希验证您打包的 app.asar,以检测任何篡改。如果不存在哈希或哈希不匹配,应用程序将强制终止。

请参阅 ASAR 完整性文档,了解有关该功能如何工作、如何在应用程序中使用它以及如何在 Electron Forge 和 Electron Packager 中使用它的完整信息。

相关新闻,Electron Packager v19 现在默认启用 ASAR。 #1841

Electron 38.0.0

·阅读时长 5 分钟

Electron 38.0.0 已发布!它包括 Chromium 140.0.7339.41、V8 14.0 和 Node 22.16.0 的升级。


Electron 团队很高兴地宣布 Electron 38.0.0 的发布!您可以使用 npm 通过 npm install electron@latest 安装它,或从我们的 发布网站 下载它。继续阅读以了解此版本的详细信息。

如果您有任何反馈,请在 BlueskyMastodon 上与我们分享,或加入我们的社区 Discord!错误和功能请求可以在 Electron 的 问题跟踪器 中报告。

Electron 37.0.0

·7分钟阅读

Electron 37.0.0 已发布!其中包括对 Chromium 138、V8 13.8 和 Node 22.16.0 的升级。


Electron 团队很高兴地宣布 Electron 37.0.0 的发布!您可以使用 npm 通过 npm install electron@latest 安装它,或从我们的 发布网站 下载它。继续阅读以了解此版本的详细信息。

如果您有任何反馈,请在 BlueskyMastodon 上与我们分享,或加入我们的社区 Discord!错误和功能请求可以在 Electron 的 问题跟踪器 中报告。

谷歌夏季实习生计划开始

我们的两位 谷歌夏季实习生计划 贡献者已经开始了编码阶段!

  • @nilayarya 正在 Electron 核心中构建一个新的 保存/恢复窗口状态 API。新的 API 将提供一种内置的、标准化的方式来处理窗口状态持久性。请参阅 Nilay 正在进行的 RFC:electron/rfcs#16
  • @hitarth-gg 正在努力使用 Chrome Manifest V3 API 现代化长期休眠的 Devtron 扩展。该项目将为开发人员提供工具,以调试 IPC 通信、跟踪事件侦听器以及可视化 Electron 应用程序中的模块依赖关系。

对于我们的 GSoC 参与者来说,这是激动人心的几周,敬请期待更多更新!

值得注意的变化

平滑圆角:原生 CSS Squircles

An image showing different corner smoothing values (0%, 30%, 60%, and 100%) applied to rectangles, with 60% labeled as matching macOS style

Electron 37 引入了自定义的 -electron-corner-smoothing CSS 属性,它允许应用程序创建更平滑的圆角以匹配 Apple 的 macOS 设计语言。此功能最初在 Electron 36 中推出,但我们认为它值得更亮的聚光灯。

100% 圆角平滑示例

代码结果
.box {
width: 128px;
height: 128px;
border-radius: 24px;
-electron-corner-smoothing: 100%;
}

与仅从矩形中雕刻四分之一圆角的标准 border-radius 属性不同,-electron-corner-smoothing 会将曲线平滑地过渡到具有连续周长的 squircle 形状。

您可以使用 0% 到 100% 的值调整平滑度,或者使用 system-ui 值以匹配操作系统的样式(macOS 上为 60%,否则为 0%)。此设计增强功能可应用于边框、轮廓和阴影,为您的应用程序增添一丝精致。

提示

请参阅 @clavinRFC 0012,了解有关 Electron squircle 实现的更多信息。该文档更详细地介绍了动机和技术实现。

最初的设计灵感来自 Figma 的圆角平滑实现。请参阅他们的“绝望地寻找 squircles”了解更多信息。

Electron 36.0.0

·阅读时长 5 分钟

Electron 36.0.0 已发布!它包含了对 Chromium 136、V8 13.6 和 Node 22.14.0 的升级。


Electron 团队很高兴地宣布 Electron 36.0.0 版本发布!您可以使用 npm 通过 npm install electron@latest 安装它,或从我们的 发布网站 下载。继续阅读以了解此版本的详细信息。

如果您有任何反馈,请在 BlueskyMastodon 上与我们分享,或加入我们的社区 Discord!错误和功能请求可以在 Electron 的 问题跟踪器 中报告。

值得注意的变化

写作工具支持

在 Electron 36 中,您可以启用 macOS 系统级别的功能,例如写作工具(拼写和语法检查)、自动填充和“服务”菜单项,在您的上下文菜单中。为此,将 WebFrameMain 实例传递给 menu.popup()frame 参数。

import { BrowserWindow, Menu, WebFrameMain } from 'electron';

const currentWindow = BrowserWindow.getFocusedWindow();
const focusedFrame = currentWindow.webContents.focusedFrame;
const menu = Menu.buildFromTemplate([{ label: 'Copy', role: 'copy' }]);

menu.popup({
window: currentWindow,
frame: focusedFrame,
});

Electron 35.0.0

·6 分钟阅读

Electron 35.0.0 已发布!它包括对 Chromium 134.0.6998.44、V8 13.5 和 Node 22.14.0 的升级。


Electron 团队很高兴地宣布 Electron 35.0.0 的发布!您可以使用 npm 通过 npm install electron@latest 安装它,或从我们的 发布网站 下载它。继续阅读以了解此版本的详细信息。

如果您有任何反馈,请在 BlueskyMastodon 上与我们分享,或加入我们的社区 Discord!错误和功能请求可以在 Electron 的 问题跟踪器 中报告。

值得注意的变化

服务工作程序预加载脚本,以改善扩展支持

最初在 RFC #8 中由 @samuelmaddock 提出,Electron 35 添加了将预加载脚本附加到 Service Workers 的能力。由于 Chrome 的 Manifest V3 扩展通过 扩展服务工作程序 路由大量工作,此功能填补了 Electron 对现代 Chrome 扩展的支持空白。

在会话级别以编程方式注册预加载脚本时,现在可以使用 ses.registerPreloadScript(script) API 将其专门应用于 Service Worker 上下文。

主进程
// Add our preload realm script to the session.
session.defaultSession.registerPreloadScript({
// Our script should only run in service worker preload realms.
type: 'service-worker',
// The absolute path to the script.
script: path.join(__dirname, 'extension-sw-preload.js'),
});

此外,IPC 现在可在 Service Worker 及其附加的预加载脚本之间通过 ServiceWorkerMain.ipc 类进行。预加载脚本仍将使用 ipcRenderer 模块与其 Service Worker 进行通信。有关更多详细信息,请参阅原始 RFC。

此功能之前有许多其他更改为其奠定了基础

  • #45329 重新设计了 Session 模块的预加载 API,以支持注册和取消注册单个预加载脚本。
  • #45229 添加了实验性的 contextBridge.executeInMainWorld(executionScript) 脚本,以通过上下文桥在主世界中评估 JavaScript。
  • #45341 添加了 ServiceWorkerMain 类来与主进程中的 Service Workers 交互。

2025 年谷歌编程之夏

·6 分钟阅读

Electron 再次被接纳为 Google Summer of Code (GSoC) 2025 的指导组织!Google Summer of Code 是一个全球性项目,旨在吸引新的贡献者加入开源软件开发。

有关该计划的更多详细信息,请访问 Google 的 夏季编程活动主页

关于我们

Electron 是一个使用 Web 技术构建跨平台桌面应用程序的 JavaScript 框架。核心 Electron 框架是一个使用 ChromiumNode.js 构建的编译二进制可执行文件,并且主要用 C++ 编写。

除了 Electron 核心仓库之外,我们还维护了几个项目来支持 Electron 生态系统,包括:

作为 GSoC 的贡献者,您将有机会与 Electron 的核心贡献者合作,在 github.com/electron 伞下的众多项目上开展工作。

申请前

如果您不熟悉 Electron,我们建议您首先阅读 文档 并尝试 Electron Fiddle 中的一些示例。

要了解有关分发 Electron 应用程序的更多信息,请尝试使用 Electron Forge 创建一个示例应用程序。

npm init electron-app@latest my-app

在熟悉代码之后,请加入 Electron Discord 服务器 进行讨论。

信息

如果您是第一次参与 Google 夏季编程活动或对开源技术来说是新手,我们建议您在与社区互动之前阅读 Google 的 贡献者指南

项目贡献

我们鼓励你查看与你感兴趣的项目想法相关的任何存储库。进行研究的一种方法是通过报告错误、分类现有问题或提交拉取请求来做出贡献。这样做是掌握我们代码库的有效方法,但并非提交提案的强制要求。一份精心制作的提案应该能够证明你对代码的理解,而无需提及过去的贡献。

如果您想在提交提案之前为 Electron 做出贡献,这里有一些提示:

  1. 提交贡献时,请提供描述性的问题或 PR 描述。无论代码本身如何,在贡献的书面部分下功夫都向我们表明您可以在协作环境中成为一名有效的沟通者。
  2. 我们随时欢迎针对未解决问题的 PR。你无需在问题下评论询问维护者是否可以分配给你。请注意,如果你需要完善解决方案的想法,我们仍然鼓励你在问题下讨论潜在的解决方案,但严格询问是否可以处理某事的评论是多余的,会给问题跟踪器增加噪音。
  3. 低投入的项目贡献(例如无效的问题报告、仓库 README 中微不足道的措辞更改或前端代码中微小的样式更改)将对你的最终提案产生负面影响,因为它们会占用有限的维护者时间,并且对 Electron 项目没有任何净收益。
  4. 虽然 AI 编码助手可以作为调试和理解新概念的有效工具,但我们强烈不鼓励直接从 AI 生成的输出复制/粘贴的贡献。这些贡献通常质量低下,维护者清理 LLM 生成的代码通常比我们直接拒绝 PR 更费力。

撰写提案

有兴趣与 Electron 合作吗?首先,请查看我们准备的 七个项目想法草案。所有列出的想法都可用于提案。

如果您有一个列表中没有的独特想法,我们愿意考虑,但请确保您的提案详细且彻底地概述。如有疑问,我们建议您坚持我们列出的想法。

您的申请应包括:

  • 一份详细的提案,概述您计划在夏季实现的目标。
  • 您作为开发者的背景。如果您有简历,请附上一份副本。否则,请告诉我们您过去的技术经验。
    • 在某些领域缺乏经验不会使您失去资格,但这将有助于我们的导师制定计划,以最好地支持您,并确保您的暑期项目取得成功。

关于如何提交 Electron 申请的详细指南在此请直接通过 Google 夏季编程活动门户网站提交提案。发送给 Electron 团队的提案将不被视为最终提交。

为了更好地指导您的提案,我们建议您遵循 此处提供的官方 Google 夏季编程活动提案撰写建议

申请于 2025年3月24日 开放,并于 2025年4月8日 截止。

过往项目提案

📚 在 2024 年的 GSoC 中,@piotrpdev 致力于向 Electron 核心文档添加 API 历史记录。要了解 Piotr 在 Electron 夏季期间的工作内容,请阅读他在 2024 年 GSoC 项目档案 中的报告。

🔐 在 2022 年的 GSoC 中,@aryanshridhar 致力于在 Electron Fiddle 中启用上下文隔离。如果您想了解 Aryan 在 Electron 夏季期间的工作内容,您可以在 2022 年 GSoC 项目档案 中阅读他的报告。

问题?

如果您对本文档中未解决的问题或关于您的提案草案的疑问,请发送电子邮件至 summer-of-code@electronjs.org 或查看 GSoC 常见问题解答。请在发送电子邮件前阅读 我们的贡献者指南

资源

Electron 34.0.0

·阅读时长 4 分钟

Electron 34.0.0 已发布!其中包括对 Chromium 132.0.6834.83、V8 13.2 和 Node 20.18.1 的升级。


Electron 团队很高兴地宣布 Electron 34.0.0 的发布!您可以使用 npm 通过 npm install electron@latest 安装它,或从我们的 发布网站 下载它。继续阅读以了解此版本的详细信息。

如果您有任何反馈,请在 BlueskyMastodon 上与我们分享,或加入我们的社区 Discord!错误和功能请求可以在 Electron 的 问题跟踪器 中报告。

值得注意的变化

HTTP 压缩共享字典管理 API

HTTP 压缩允许 Web 服务器在数据被浏览器接收之前对其进行压缩。现代版本的 Chromium 支持 Brotli 和 Zstandard,这些是比 gzip 等旧方案性能更好的新型压缩算法,适用于文本文件。

自定义共享字典进一步提高了 Brotli 和 Zstandard 压缩的效率。请参阅 Chrome for Developers 博客上的共享字典,了解更多信息。

@felixrieseberg#44950 中添加了以下 API,以在会话级别管理共享字典

  • session.getSharedDictionaryUsageInfo()
  • session.getSharedDictionaryInfo(options)
  • session.clearSharedDictionaryCache()
  • session.clearSharedDictionaryCacheForIsolationKey(options)

无响应渲染器 JavaScript 调用堆栈

Electron 的 unresponsive 事件发生在渲染器进程挂起过长时间时。由 @samuelmaddock#44204 中添加的新 WebFrameMain.collectJavaScriptCallStack() API 允许您从关联的 WebFrameMain 对象(webContnets.mainFrame)收集 JavaScript 调用堆栈。

此 API 在导致进程挂起的长时间运行 JavaScript 事件的情况下,可以帮助确定框架无响应的原因。有关更多信息,请参阅 提议的网络标准崩溃报告 API

主进程
const { app } = require('electron');

app.commandLine.appendSwitch(
'enable-features',
'DocumentPolicyIncludeJSCallStacksInCrashReports',
);

app.on('web-contents-created', (_, webContents) => {
webContents.on('unresponsive', async () => {
// Interrupt execution and collect call stack from unresponsive renderer
const callStack = await webContents.mainFrame.collectJavaScriptCallStack();
console.log('Renderer unresponsive\n', callStack);
});
});
警告

此 API 需要启用 'Document-Policy': 'include-js-call-stacks-in-crash-reports' 标头。请参阅 #45356,了解更多详细信息。