编者按：近日，Electron 20.0.0 发布，并在官方博客发布文章，本文内容是语雀工程师佳心根据博客的内容整理的她认为那些值得关注的变化、新特性及相关内容。
Electron 20.0.0 博客地址：https://www.electronjs.org/zh/blog/electron-20-0

最近几个版本开始，Electron 的更新日志都有对应的中文版翻译，所以之后就不再做重复的直译，主要列举我认为那些值得关注的变化、新特性及相关内容。

Chromium 104

Node.js 16.15.0

V8 10.4

一、支持 Windows 沉浸式暗黑模式

Electron 目前支持通过设置 nativeTheme.themeSource = 'dark' 来使用暗黑模式。

但是我个人测了两台 Windows 10，并没有感受到很大的区别，还是只有 context menu  和 devtools 有暗色：

看 PR close 了 #32913，应该是要在 nativeTheme.themeSource = 'system' 支持 titlebar 匹配暗色模式的：

但是实测下来，在默认应用模式为暗时，titlebar 并没有变为暗色，还是如上图的亮色，感觉是个 bug；只有在设置「在以下区域显示主题色」勾选「标题栏」时 titlebar 颜色才改为主题色（可能是各种彩色）。

🔗 https://github.com/electron/electron/pull/34549

二、macOS 新增 panel 类型 BrowserWindow

在 macOS 上，BrowserWindow 的表现形式除了以往支持的 desktop 和 textured，新增了 panel 类型：

来看看这三种窗口的具体表现：

• textured 类型：增加金属色泽的外观 (NSTexturedBackgroundWindowMask)。
  

• desktop 类型：将窗口置于桌面背景级别 (kCGDesktopWindowLevel - 1)，窗口不会接收焦点、键盘或鼠标事件。

• panel 类型：窗口可以浮动在全屏应用上

🔗 https://github.com/electron/electron/pull/34665

、Renderer 默认沙盒化

在 Electron 20 之前，Renderer 的预加载脚本是默认不启用沙盒的，即可以直接在  preload.js 里使用 Node.js。

在 Electron 20 中，Renderer 默认开启沙盒化，如果不指定  nodeIntegration: true 或 sandbox: false，将无法使用 Node.js。

🔗 https://github.com/electron/electron/pull/35125

四、构建原生模块时注意依赖版本

构建原生模块时，建议 node-gyp 最小版本 8.4.0，electron-rebuild 最小版本 3.2.9。

🔗https://github.com/electron/electron/pull/35160

五、Chrome 104、103 带来的变化

获取本地字体

通过 window.queryLocalFonts() 可以获取设备的所有本地字体信息：

const pickedFonts = await window.queryLocalFonts();const fontData = pickedFonts[0];console.log(fontData.postscriptName);console.log(fontData.fullName);console.log(fontData.family);console.log(fontData.style);

HTTP 状态码 103 - Early Hints

允许浏览器在服务器还在准备响应数据的时候预加载一些其他资源：

<link as="font" crossorigin="anonymous" href="..." rel="preload"><link as="font" crossorigin="anonymous" href="..." rel="preload"><link href="https://web-dev.imgix.net" rel="preconnect">

New in Chrome 104：https://developer.chrome.com/blog/new-in-chrome-104/

New in Chrome 103：https://developer.chrome.com/blog/new-in-chrome-103/

注：语雀桌面客户端就是使用 Electron 开发的，如果你有兴趣可以下载体验：https://www.yuque.com/download