我们将开始每月汇总 Electron 社区的动态。每个综述都会介绍新应用、即将举行的聚会、工具、视频等内容。

¥We're starting a monthly roundup to highlight activity in the Electron community. Each roundup will feature things like new apps, upcoming meetups, tools, videos, etc.

本网站已更新来自社区的新 apps、meetups 到 拉取请求。你可以订阅 查看代码库 以获取新增内容的通知，或者如果你对网站的所有更改不感兴趣，请订阅 博客 RSS 订阅。

¥This site is updated with new apps and meetups through pull requests from the community. You can watch the repository to get notifications of new additions or if you're not interested in all of the site's changes, subscribe to the blog RSS feed.

如果你开发过 Electron 应用或举办过聚会，请创建一个 拉取请求 并将其添加到网站，它将出现在下一轮总结中。

¥If you've made an Electron app or host a meetup, make a pull request to add it to the site and it will make the next roundup.

新应用​

¥New Apps

新的聚会​

¥New Meetups

这是解释 Electron 内部原理的系列文章的第一篇。本文介绍了如何在 Electron 中将 Node 的事件循环与 Chromium 集成。

¥This is the first post of a series that explains the internals of Electron. This post introduces how Node's event loop is integrated with Chromium in Electron.

曾有多次尝试使用 Node 进行 GUI 编程，例如用于 GTK+ 绑定的 node-gui 和用于 QT 绑定的 node-qt。但它们都无法在生产环境中运行，因为 GUI 工具包有自己的消息循环，而 Node 使用 libuv 作为自己的事件循环，并且主线程一次只能运行一个循环。在 Node 中运行 GUI 消息循环的常用技巧是使用间隔非常短的计时器来触发消息循环，这会导致 GUI 界面响应缓慢并占用大量 CPU 资源。

¥There had been many attempts to use Node for GUI programming, like node-gui for GTK+ bindings, and node-qt for QT bindings. But none of them work in production because GUI toolkits have their own message loops while Node uses libuv for its own event loop, and the main thread can only run one loop at the same time. So the common trick to run GUI message loop in Node is to pump the message loop in a timer with very small interval, which makes GUI interface response slow and occupies lots of CPU resources.

在 Electron 的开发过程中，我们也遇到了同样的问题，尽管方式相反：我们必须将 Node 的事件循环集成到 Chromium 的消息循环中。

¥During the development of Electron we met the same problem, though in a reversed way: we had to integrate Node's event loop into Chromium's message loop.

主进程和渲染进程​

¥The main process and renderer process

在深入探讨消息循环集成的细节之前，我将首先解释一下 Chromium 的多进程架构。

¥Before we dive into the details of message loop integration, I'll first explain the multi-process architecture of Chromium.

Electron 中有两种类型的进程：主进程和渲染进程（这实际上已经极其简化，完整视图请参见 多进程架构）。主进程负责 GUI 工作，例如创建窗口，而渲染进程仅负责运行和渲染网页。

¥In Electron there are two types of processes: the main process and the renderer process (this is actually extremely simplified, for a complete view please see Multi-process Architecture). The main process is responsible for GUI work like creating windows, while the renderer process only deals with running and rendering web pages.

Electron 允许使用 JavaScript 同时控制主进程和渲染进程，这意味着我们必须将 Node 集成到这两个进程中。

¥Electron allows using JavaScript to control both the main process and renderer process, which means we have to integrate Node into both processes.

用 libuv 替换 Chromium 的消息循环​

¥Replacing Chromium's message loop with libuv

我的第一次尝试是使用 libuv 重新实现 Chromium 的消息循环。

¥My first try was reimplementing Chromium's message loop with libuv.

对于渲染器进程来说很容易，因为它的消息循环只监听文件描述符和计时器，我只需要使用 libuv 实现接口即可。

¥It was easy for the renderer process, since its message loop only listened to file descriptors and timers, and I only needed to implement the interface with libuv.

但是，这对于主进程来说要困难得多。每个平台都有自己的 GUI 消息循环。macOS Chromium 使用 NSRunLoop，而 Linux 使用 glib。我尝试了很多方法，从原生 GUI 消息循环中提取底层文件描述符，然后将它们传递给 libuv 进行迭代，但仍然遇到了一些无效的极端情况。

¥However it was significantly more difficult for the main process. Each platform has its own kind of GUI message loops. macOS Chromium uses NSRunLoop, whereas Linux uses glib. I tried lots of hacks to extract the underlying file descriptors out of the native GUI message loops, and then fed them to libuv for iteration, but I still met edge cases that did not work.

因此，我最终添加了一个计时器，用于在短时间间隔内轮询 GUI 消息循环。因此，该进程会持续占用 CPU，并且某些操作会长时间延迟。

¥So finally I added a timer to poll the GUI message loop in a small interval. As a result the process took a constant CPU usage, and certain operations had long delays.

在单独线程中轮询 Node 的事件循环​

¥Polling Node's event loop in a separate thread

随着 libuv 的成熟，我们开始采用另一种方法。

¥As libuv matured, it was then possible to take another approach.

libuv 中引入了后端 fd 的概念，它是一个文件描述符（或句柄），libuv 会轮询它以进行事件循环。因此，通过轮询后端文件描述符 (fd)，可以在 libuv 中出现新事件时收到通知。

¥The concept of backend fd was introduced into libuv, which is a file descriptor (or handle) that libuv polls for its event loop. So by polling the backend fd it is possible to get notified when there is a new event in libuv.

因此，我在 Electron 中创建了一个单独的线程来轮询后端文件描述符 (fd)。由于我使用系统调用进行轮询而不是使用 libuv API，因此它是线程安全的。每当 libuv 的事件循环中出现新事件时，都会向 Chromium 的消息循环发送一条消息，然后 libuv 的事件将在主线程中处理。

¥So in Electron I created a separate thread to poll the backend fd, and since I was using the system calls for polling instead of libuv APIs, it was thread safe. And whenever there was a new event in libuv's event loop, a message would be posted to Chromium's message loop, and the events of libuv would then be processed in the main thread.

通过这种方式，我避免了同时修补 Chromium 和 Node，并且主进程和渲染进程都使用了相同的代码。

¥In this way I avoided patching Chromium and Node, and the same code was used in both the main and renderer processes.

代码​

¥The code

你可以在 electron/atom/common/ 下的 node_bindings 文件中找到消息循环集成的实现。它可以轻松地复用到想要集成 Node 的项目。

¥You can find the implemention of the message loop integration in the node_bindings files under electron/atom/common/. It can be easily reused for projects that want to integrate Node.

更新：实现已移至 electron/shell/common/node_bindings.cc。

¥Update: Implementation moved to electron/shell/common/node_bindings.cc.

正在寻找 Electron 的入门介绍？刚刚发布了两个新的播客，详细介绍了 TypeScript 的概念、构建原因以及使用方法。

¥Looking for an introduction to Electron? Two new podcasts have just been released that give a great overview of what it is, why it was built, and how it is being used.

现已推出：

¥Out now:

Hanselminutes:创建跨平台 Electron 应用​

¥Hanselminutes: Creating cross-platform Electron apps

Electron 是 "框架中的 Chrome" 还是远不止于此？Jessica 为 Scott 指明了正确的方向，并详细解释了 Electron 平台在你的开发世界中的定位。

¥Is Electron "just Chrome in a frame" or is it so much more? Jessica sets Scott on the right path and explains exactly where the Electron platform fits into your development world.

JavaScript Air:Electron 应用​

¥JavaScript Air: Electron Apps

Electron 正成为一种越来越流行且实用的、利用 Web 技术构建多平台桌面应用的方式。让我们深入了解这项令人惊叹的技术，看看如何利用它来提升我们自己以及用户在桌面上的体验。

¥Electron is becoming more and more of a relevant and popular way of building multi-platform desktop apps with web technologies. Let's get a dive into this awesome tech and see how we can use it to enhance our own experience and our user's experience on the desktop.

如果你正在寻找 Electron 的入门介绍，请先听一听。第二个脚本更详细地介绍了如何构建应用，并提供了 Nylas 的 Evan Morikawa 中的实用技巧。

¥If you're looking for an introduction to Electron, give the first a listen. The second goes into more detail about building apps with great tips from Nylas's Evan Morikawa.

我们目前正在制作另外两个播客，预计将于下个月发布，请关注 @ElectronJS 的 Twitter 账号以获取最新动态。

¥We are currently working on two more podcasts that should come out next month, keep an eye on the @ElectronJS Twitter account for updates.

在过去的两年里，Electron 帮助开发者使用 HTML、CSS 和 JavaScript 构建跨平台桌面应用。现在，我们很高兴能与大家分享我们框架以及创建它的社区的一个重要里程碑。Electron 1.0 现已从 electronjs.org 开始提供。

¥For the last two years, Electron has helped developers build cross platform desktop apps using HTML, CSS, and JavaScript. Now we're excited to share a major milestone for our framework and for the community that created it. The release of Electron 1.0 is now available from electronjs.org.

Electron 1.0 代表了 API 稳定性和成熟度方面的一个重要里程碑。此版本允许你构建在 Windows、Mac 和 Linux 上真正原生运行的应用。借助新文档、新工具以及一个引导你了解 Electron API 的新应用，构建 Electron 应用比以往任何时候都更加简单。

¥Electron 1.0 represents a major milestone in API stability and maturity. This release allows you to build apps that act and feel truly native on Windows, Mac, and Linux. Building Electron apps is easier than ever with new docs, new tools, and a new app to walk you through the Electron APIs.

如果你准备构建你的第一个 Electron 应用，那么这篇 快速入门指南 文章可以帮助你入门。

¥If you're ready to build your very first Electron app, here's a quick start guide to help you get started.

我们期待看到你接下来使用 Electron 构建的作品。

¥We are excited to see what you build next with Electron.

Electron 路径​

¥Electron's Path

两年多前，我们在发布 Atom 时就发布了 Electron。Electron，当时被称为 Atom Shell，是我们构建 Atom 所基于的框架。在那些日子里，Atom 是 Electron 提供的特性和功能背后的驱动力，我们推动着 Atom 的初始版本发布。

¥We released Electron when we launched Atom a little over two years ago. Electron, then known as Atom Shell, was the framework we'd built Atom on top of. In those days, Atom was the driving force behind the features and functionalities that Electron provided as we pushed to get the initial Atom release out.

现在，推动 Electron 发展的是一个日益壮大的开发者和公司社区，他们构建了从 email、chat、Git 应用 到 SQL 分析工具、种子客户端 和 robots 的所有版本。

¥Now driving Electron is a growing community of developers and companies building everything from email, chat, and Git apps to SQL analytics tools, torrent clients, and robots.

在过去的两年里，我们看到许多公司和开源项目都选择 Electron 作为其应用的基础。仅在过去的一年里，Electron 的下载量就已超过 120 万次。浏览 支持一些出色的 Electron 应用，如果你还没有自己的应用，也可以添加。

¥In these last two years we've seen both companies and open source projects choose Electron as the foundation for their apps. Just in the past year, Electron has been downloaded over 1.2 million times. Take a tour of some of the amazing Electron apps and add your own if it isn't already there.

Electron API 演示​

¥Electron API Demos

随着 1.0 版本的发布，我们将发布一款新应用，帮助你探索 Electron API，并学习如何让你的 Electron 应用体验原生化。Electron API 演示 应用包含一些代码片段，可帮助你快速启动应用，并提供有效使用 Electron API 的技巧。

¥Along with the 1.0 release, we're releasing a new app to help you explore the Electron APIs and learn more about how to make your Electron app feel native. The Electron API Demos app contains code snippets to help you get your app started and tips on effectively using the Electron APIs.

Devtron​

我们还添加了一个新的扩展程序，以帮助你调试 Electron 应用。Devtron 是 Chrome 开发者工具 的一个开源扩展，旨在帮助你检查、调试和排除 Electron 应用的故障。

¥We've also added a new extension to help you debug your Electron apps. Devtron is an open-source extension to the Chrome Developer Tools designed to help you inspect, debug, and troubleshoot your Electron app.

功能​

¥Features

• 需要一个图表，帮助你在主进程和渲染进程中可视化应用的内部和外部库依赖。

  ¥Require graph that helps you visualize your app's internal and external library dependencies in both the main and renderer processes

• IPC 监视器，用于跟踪并显示应用中进程之间发送和接收的消息

  ¥IPC monitor that tracks and displays the messages sent and received between the processes in your app

• 事件检查器可显示在应用中通过核心 Electron API（例如窗口、应用和进程）注册的事件和监听器。

  ¥Event inspector that shows you the events and listeners that are registered in your app on the core Electron APIs such as the window, app, and processes

• App Linter 可以检查你的应用是否存在常见错误和缺失功能。

  ¥App Linter that checks your apps for common mistakes and missing functionality

Spectron​

终于，我们发布了新版 Spectron，它是 Electron 应用的集成测试框架。

¥Finally, we're releasing a new version of Spectron, the integration testing framework for Electron apps.

Spectron 3.0 全面支持整个 Electron API，使你可以更快地编写测试，以验证应用在各种场景和环境下的行为。Spectron 基于 ChromeDriver 和 WebDriverIO，因此它拥有完整的页面导航、用户输入和 JavaScript 执行 API。

¥Spectron 3.0 has comprehensive support for the entire Electron API allowing you to more quickly write tests that verify your application's behavior in various scenarios and environments. Spectron is based on ChromeDriver and WebDriverIO so it also has full APIs for page navigation, user input, and JavaScript execution.

社区​

¥Community

Electron 1.0 是数百名开发者社区努力的成果。除了核心框架之外，我们已经发布了数百个库和工具，使 Electron 应用的构建、打包和部署更加容易。

¥Electron 1.0 is the result of a community effort by hundreds of developers. Outside of the core framework, there have been hundreds of libraries and tools released to make building, packaging, and deploying Electron apps easier.

现在有一个新的 community 页面，列出了许多正在开发的优秀 Electron 工具、应用、库和框架。你还可以查看 Electron 和 Electron 用户空间 组织，了解其中一些精彩的项目。

¥There is now a new community page that lists many of the awesome Electron tools, apps, libraries, and frameworks being developed. You can also check out the Electron and Electron Userland organizations to see some of these fantastic projects.

Electron 新手？观看 Electron 1.0 介绍视频：

¥New to Electron? Watch the Electron 1.0 intro video:

Electron 0.37 最近发布了 released，其中包含从 Chrome 47 到 Chrome 49 的重大升级，以及几个新的核心 API。此最新版本引入了 Chrome 48 和 Chrome 49 中的所有新功能。这包括 CSS 自定义属性、增强的 ES6 支持、KeyboardEvent 改进、Promise 改进以及许多其他现已在 Electron 应用中提供的新功能。

¥Electron 0.37 was recently released and included a major upgrade from Chrome 47 to Chrome 49 and also several new core APIs. This latest release brings in all the new features shipped in Chrome 48 and Chrome 49. This includes CSS custom properties, increased ES6 support, KeyboardEvent improvements, Promise improvements, and many other new features now available in your Electron app.

新功能​

¥What's New

CSS 自定义属性​

¥CSS Custom Properties

如果你使用过 Sass 和 Less 等预处理语言，你可能熟悉变量，它允许你为配色方案和布局等内容定义可重用的值。变量有助于保持样式表的 DRY 原则并更易于维护。

¥If you've used preprocessed languages like Sass and Less, you're probably familiar with variables, which allow you to define reusable values for things like color schemes and layouts. Variables help keep your stylesheets DRY and more maintainable.

CSS 自定义属性与预处理变量类似，因为它们可重用，但它们还具有独特的特性，使其更加强大和灵活：它们可以使用 JavaScript 进行操作。这项微妙但强大的功能允许动态更改可视化界面，同时仍然受益于 CSS 的硬件加速，并减少前端代码和样式表之间的代码重复。

¥CSS custom properties are similar to preprocessed variables in that they are reusable, but they also have a unique quality that makes them even more powerful and flexible: they can be manipulated with JavaScript. This subtle but powerful feature allows for dynamic changes to visual interfaces while still benefitting from CSS's hardware acceleration, and reduced code duplication between your frontend code and stylesheets.

有关 CSS 自定义属性的更多信息，请参阅 MDN 文章 和 Google Chrome 演示。

¥For more info on CSS custom properties, see the MDN article and the Google Chrome demo.

CSS 变量的实际应用​

¥CSS Variables In Action

让我们来看一个可以在你的应用中实时调整的简单变量示例。

¥Let's walk through a simple variable example that can be tweaked live in your app.

:root {
  --awesome-color: #a5ecfa;
}

body {
  background-color: var(--awesome-color);
}

变量值可以直接在 JavaScript 中检索和更改：

¥The variable value can be retrieved and changed directly in JavaScript:

// Get the variable value ' #A5ECFA'
let color = window
  .getComputedStyle(document.body)
  .getPropertyValue('--awesome-color');

// Set the variable value to 'orange'
document.body.style.setProperty('--awesome-color', 'orange');

变量值也可以从开发工具的“样式”部分进行编辑，以便快速获得反馈和调整：

¥The variable values can be also edited from the Styles section of the development tools for quick feedback and tweaks:

KeyboardEvent.code 属性​

¥KeyboardEvent.code Property

Chrome 48 添加了新的 code 属性，该属性在 KeyboardEvent 事件中可用，该事件将是独立于操作系统键盘布局的物理按键按下事件。

¥Chrome 48 added the new code property available on KeyboardEvent events that will be the physical key pressed independent of the operating system keyboard layout.

这应该使你在 Electron 应用中实现自定义键盘快捷键在不同机器和配置之间更加准确和一致。

¥This should make implementing custom keyboard shortcuts in your Electron app more accurate and consistent across machines and configurations.

window.addEventListener('keydown', function (event) {
  console.log(`${event.code} was pressed.`);
});

查看 这个例子 以了解其实际应用。

¥Check out this example to see it in action.

Promise 拒绝事件​

¥Promise Rejection Events

Chrome 49 添加了两个新的 window 事件，当被拒绝的 Promise 事件未得到处理时，你可以收到通知。

¥Chrome 49 added two new window events that allow you to be notified when an rejected Promise goes unhandled.

window.addEventListener('unhandledrejection', function (event) {
  console.log('A rejected promise was unhandled', event.promise, event.reason);
});

window.addEventListener('rejectionhandled', function (event) {
  console.log('A rejected promise was handled', event.promise, event.reason);
});

查看 这个例子 以了解其实际应用。

¥Check out this example to see it in action.

V8 中的 ES2015 更新​

¥ES2015 Updates in V8

Electron 中现在的 V8 版本集成了 ES2015 的 91%。以下是一些你可以开箱即用的有趣新增功能 - 无需标志或预编译器：

¥The version of V8 now in Electron incorporates 91% of ES2015. Here are a few interesting additions you can use out of the box—without flags or pre-compilers:

默认参数​

¥Default parameters

function multiply(x, y = 1) {
  return x * y;
}

multiply(5); // 5

解构赋值​

¥Destructuring assignment

Chrome 49 添加了 解构赋值 属性，使变量和函数参数的赋值更加容易。

¥Chrome 49 added destructuring assignment to make assigning variables and function parameters much easier.

这使得 Electron 的需求分配更加简洁紧凑：

¥This makes Electron requires cleaner and more compact to assign now:

浏览器进程要求​

¥Browser Process Requires

const { app, BrowserWindow, Menu } = require('electron');

渲染器进程需求​

¥Renderer Process Requires

const { dialog, Tray } = require('electron').remote;

其他示例​

¥Other Examples

// Destructuring an array and skipping the second element
const [first, , last] = findAll();

// Destructuring function parameters
function whois({ displayName: displayName, fullName: { firstName: name } }) {
  console.log(`${displayName} is ${name}`);
}

let user = {
  displayName: 'jdoe',
  fullName: {
    firstName: 'John',
    lastName: 'Doe',
  },
};
whois(user); // "jdoe is John"

// Destructuring an object
let { name, avatar } = getUser();

新的 Electron API​

¥New Electron APIs

以下是一些新的 Electron API，你可以在 Electron 版本发布 的发行说明中查看每个新 API。

¥A few of the new Electron APIs are below, you can see each new API in the release notes for Electron releases.

BrowserWindow 上的 show 和 hide 事件​

¥show and hide events on BrowserWindow

这些事件在窗口显示或隐藏时发出。

¥These events are emitted when the window is either shown or hidden.

const { BrowserWindow } = require('electron');

let window = new BrowserWindow({ width: 500, height: 500 });
window.on('show', function () {
  console.log('Window was shown');
});
window.on('hide', function () {
  console.log('Window was hidden');
});

OS X 上的 app 上的 platform-theme-changed​

¥platform-theme-changed on app for OS X

切换系统的 夜间模式 主题时会触发此事件。

¥This event is emitted when the system’s Dark Mode theme is toggled.

const { app } = require('electron');

app.on('platform-theme-changed', function () {
  console.log(`Platform theme changed. In dark mode? ${app.isDarkMode()}`);
});

OS X 上的 app.isDarkMode()​

¥app.isDarkMode() for OS X

如果系统处于黑夜间模式，此方法返回 true，否则返回 false。

¥This method returns true if the system is in Dark Mode, and false otherwise.

OS X 的 BrowserWindow 中 scroll-touch-begin 和 scroll-touch-end 事件​

¥scroll-touch-begin and scroll-touch-end events to BrowserWindow for OS X

这些事件在滚轮事件阶段开始或结束时发出。

¥These events are emitted when the scroll wheel event phase has begun or has ended.

const { BrowserWindow } = require('electron');

let window = new BrowserWindow({ width: 500, height: 500 });
window.on('scroll-touch-begin', function () {
  console.log('Scroll touch started');
});
window.on('scroll-touch-end', function () {
  console.log('Scroll touch ended');
});

构建 Electron 应用意味着你只需创建一份代码库并针对一个浏览器进行设计，这非常方便。但由于 Electron 会与 Node.js 和 Chromium 保持同步更新，因此你也可以使用它们自带的强大功能。在某些情况下，这可以消除你之前可能需要在 Web 应用中包含的依赖。

¥Building an Electron application means you only need to create one codebase and design for one browser, which is pretty handy. But because Electron stays up to date with Node.js and Chromium as they release, you also get to make use of the great features they ship with. In some cases this eliminates dependencies you might have previously needed to include in a web app.

Electron 项目有很多功能，我们将在这里作为示例介绍其中的一些，但如果你想了解所有功能，可以关注 Google Chromium 博客 和 Node.js 更新日志。你可以查看 electronjs.org/#electron-versions 使用的 Node.js、Chromium 和 V8 Electron 版本。

¥There are many features and we'll cover some here as examples, but if you're interested in learning about all features you can keep an eye on the Google Chromium blog and Node.js changelogs. You can see what versions of Node.js, Chromium and V8 Electron is using at electronjs.org/#electron-versions.

通过 V8 支持 ES6​

¥ES6 Support through V8

Electron 将 Chromium 的渲染库与 Node.js 相结合。它们共享同一个 JavaScript 引擎 V8。许多 ECMAScript 2015 (ES6) 功能已内置于 V8 中，这意味着你可以在 Electron 应用中使用它们，而无需任何编译器。

¥Electron combines Chromium's rendering library with Node.js. The two share the same JavaScript engine, V8. Many ECMAScript 2015 (ES6) features are already built into V8 which means you can use them in your Electron application without any compilers.

以下是一些示例，但你也可以获得类（在严格模式下）、块作用域、Promise、类型数组等等。查看 这个清单 以了解更多关于 V8 中 ES6 特性的信息。

¥Below are a few examples but you can also get classes (in strict mode), block scoping, promises, typed arrays and more. Check out this list for more information on ES6 features in V8.

箭头函数

¥Arrow Functions

findTime () => {
  console.log(new Date())
}

字符串插值

¥String Interpolation

var octocat = 'Mona Lisa';
console.log(`The octocat's name is ${octocat}`);

新目标

¥New Target

Octocat() => {
  if (!new.target) throw "Not new";
  console.log("New Octocat");
}

// Throws
Octocat();
// Logs
new Octocat();

数组包含

¥Array Includes

// Returns true
[1, 2].includes(2);

剩余参数

¥Rest Parameters

// Represent indefinite number of arguments as an array
(o, c, ...args) => {
  console.log(args.length);
};

Chromium 功能​

¥Chromium Features

感谢 Google 和贡献者为 Chromium 付出的辛勤劳动，在你构建 Electron 应用时，你还可以使用以下一些很酷的功能（但不限于）：

¥Thanks to all the hard work Google and contributors put into Chromium, when you build Electron apps you can also use cool things like (but not limited to):

• MouseEvent.getModifierState()

• CSS.escape()

• Fetch API Streaming

关注 Google Chromium 博客，了解新版本发布的功能，同样，你也可以查看 Electron 使用的 Chromium 版本 此处。

¥Follow along with the Google Chromium blog to learn about features as new versions ship and again, you can check the version of Chromium that Electron uses here.

你对什么感到兴奋？​

¥What are you excited about?

在 Twitter 上向我们 @ElectronJS 推荐你最喜欢的 V8 或 Chromium 内置功能。

¥Tweet to us @ElectronJS with your favorite features built into V8 or Chromium.

自 Electron 诞生之初（当时它被称为 Atom-Shell）以来，我们一直在尝试为 Chromium 的内容模块和原生 GUI 组件提供优秀的跨平台 JavaScript API。这些 API 最初是有机地形成的，随着时间的推移，我们对其进行了多次修改，以改进初始设计。

¥Since the beginning of Electron, starting way back when it used to be called Atom-Shell, we have been experimenting with providing a nice cross-platform JavaScript API for Chromium's content module and native GUI components. The APIs started very organically, and over time we have made several changes to improve the initial designs.

随着 Electron 即将发布 1.0 版本，我们希望借此机会进行改进，解决最后几个繁琐的 API 细节问题。以下描述的更改包含在 0.35.x 版本中，旧 API 会报告弃用警告，以便你及时了解未来 1.0 版本的更新信息。Electron 1.0 还要几个月才会发布，因此在这些更改造成重大影响之前，你还有一段时间。

¥Now with Electron gearing up for a 1.0 release, we'd like to take the opportunity for change by addressing the last niggling API details. The changes described below are included in 0.35.x, with the old APIs reporting deprecation warnings so you can get up to date for the future 1.0 release. An Electron 1.0 won't be out for a few months so you have some time before these changes become breaking.

弃用警告​

¥Deprecation warnings

默认情况下，如果你使用已弃用的 API，则会显示警告。要关闭它们，你可以将 process.noDeprecation 设置为 true。要追踪已弃用 API 的使用来源，你可以将 process.throwDeprecation 设置为 true，以抛出异常而不是打印警告；或者，你可以将 process.traceDeprecation 设置为 true，以打印弃用 API 的痕迹。

¥By default, warnings will show if you are using deprecated APIs. To turn them off you can set process.noDeprecation to true. To track the sources of deprecated API usages, you can set process.throwDeprecation to true to throw exceptions instead of printing warnings, or set process.traceDeprecation to true to print the traces of the deprecations.

使用内置模块的新方法​

¥New way of using built-in modules

内置模块现在被分组为一个模块，而不是拆分成独立的模块，因此你可以使用它们 不与其他模块冲突：

¥Built-in modules are now grouped into one module, instead of being separated into independent modules, so you can use them without conflicts with other modules:

var app = require('electron').app;
var BrowserWindow = require('electron').BrowserWindow;

为了向后兼容，旧方法 require('app') 仍然受支持，但你也可以将其关闭：

¥The old way of require('app') is still supported for backward compatibility, but you can also turn if off:

require('electron').hideInternalModules();
require('app'); // throws error.

更轻松地使用 remote 模块的方法​

¥An easier way to use the remote module

由于使用内置模块的方式发生了变化，我们简化了在渲染进程中使用主进程侧模块的流程。现在你可以直接访问 remote 的属性来使用它们：

¥Because of the way using built-in modules has changed, we have made it easier to use main-process-side modules in renderer process. You can now just access remote's attributes to use them:

// New way.
var app = require('electron').remote.app;
var BrowserWindow = require('electron').remote.BrowserWindow;

不使用冗长的请求链：

¥Instead of using a long require chain:

// Old way.
var app = require('electron').remote.require('app');
var BrowserWindow = require('electron').remote.require('BrowserWindow');

拆分 ipc 模块​

¥Splitting the ipc module

ipc 模块同时存在于主进程和渲染进程中，并且两者的 API 不同，这会让新用户感到困惑。为了避免混淆，我们已将主进程中的模块重命名为 ipcMain，并将渲染进程中的模块重命名为 ipcRenderer：

¥The ipc module existed on both the main process and renderer process and the API was different on each side, which is quite confusing for new users. We have renamed the module to ipcMain in the main process, and ipcRenderer in the renderer process to avoid confusion:

// In main process.
var ipcMain = require('electron').ipcMain;

// In renderer process.
var ipcRenderer = require('electron').ipcRenderer;

对于 ipcRenderer 模块，在接收消息时添加了一个额外的 event 对象，以匹配 ipcMain 模块中消息的处理方式：

¥And for the ipcRenderer module, an extra event object has been added when receiving messages, to match how messages are handled in ipcMain modules:

ipcRenderer.on('message', function (event) {
  console.log(event);
});

标准化 BrowserWindow 选项​

¥Standardizing BrowserWindow options

BrowserWindow 选项的样式基于其他 API 的选项而有所不同，并且由于名称中包含 -，在 JavaScript 中使用起来有点困难。它们现在已标准化为传统的 JavaScript 名称：

¥The BrowserWindow options had different styles based on the options of other APIs, and were a bit hard to use in JavaScript because of the - in the names. They are now standardized to the traditional JavaScript names:

new BrowserWindow({ minWidth: 800, minHeight: 600 });

遵循 DOM 的 API 命名约定​

¥Following DOM's conventions for API names

Electron 中的 API 名称过去通常都采用驼峰命名法，例如 Url 到 URL，但 DOM 有自己的约定，它们更喜欢 URL 到 Url，同时使用 Id 而不是 ID。我们已重命名以下 API 以匹配 DOM 的样式：

¥The API names in Electron used to prefer camelCase for all API names, like Url to URL, but the DOM has its own conventions, and they prefer URL to Url, while using Id instead of ID. We have done the following API renames to match the DOM's styles:

• Url 已重命名为 URL

  ¥Url is renamed to URL

• Csp 已重命名为 CSP

  ¥Csp is renamed to CSP

由于这些变更，当你的应用使用 Electron v0.35.0 时，你会注意到许多弃用功能。修复这些问题的一个简单方法是将所有 Url 实例替换为 URL。

¥You will notice lots of deprecations when using Electron v0.35.0 for your app because of these changes. An easy way to fix them is to replace all instances of Url with URL.

Tray 事件名称变更​

¥Changes to Tray's event names

Tray 事件名称的风格与其他模块略有不同，因此已重命名以使其与其他模块匹配。

¥The style of Tray event names was a bit different from other modules so a rename has been done to make it match the others.

• clicked 已重命名为 click

  ¥clicked is renamed to click

• double-clicked 已重命名为 double-click

  ¥double-clicked is renamed to double-click

• right-clicked 已重命名为 right-click

  ¥right-clicked is renamed to right-click

最近，Electron 新增了两项激动人心的功能：兼容 Mac App Store 的版本和内置的 Windows 自动更新程序。

¥Recently Electron added two exciting features: a Mac App Store compatible build and a built-in Windows auto updater.

Mac App Store 支持​

¥Mac App Store Support

从 v0.34.0 开始，每个 Electron 版本都包含与 Mac App Store 兼容的版本。以前，基于 Electron 构建的应用不符合 Apple 对 Mac App Store 的要求。这些需求大多与私有 API 的使用有关。为了使 Electron 符合沙盒化要求，需要删除两个模块：

¥As of v0.34.0 each Electron release includes a build compatible with the Mac App Store. Previously an application built on Electron would not comply with Apple's requirements for the Mac App Store. Most of these requirements are related to the use of private APIs. In order to sandbox Electron in such a way that it complies with the requirements two modules needed to be removed:

• crash-reporter

• auto-updater

此外，在检测 DNS 更改、视频捕获和辅助功能方面，一些行为也发生了变化。你可以在文档中阅读更多关于变更和 将应用提交至 Mac App Store 的信息。发行版可在 Electron 版本发布页面 上找到，前缀为 mas-。

¥Additionally some behaviors have changed with respect to detecting DNS changes, video capture and accessibility features. You can read more about the changes and submitting your app to the Mac App store in the documentation. The distributions can be found on the Electron releases page, prefixed with mas-.

相关拉取请求：electron/electron#3108、electron/electron#2920

¥Related Pull Requests: electron/electron#3108, electron/electron#2920

Windows 自动更新程序​

¥Windows Auto Updater

在 Electron v0.34.1 中，auto-updater 模块得到了改进，以便与 Squirrel.Windows。这意味着 Electron 提供了在 OS X 和 Windows 上自动更新应用的简便方法。你可以在文档中阅读有关 在 Windows 上设置应用自动更新 的更多信息。

¥In Electron v0.34.1 the auto-updater module was improved in order to work with Squirrel.Windows. This means that Electron ships with easy ways for auto updating your app on both OS X and Windows. You can read more on setting up your app for auto updating on Windows in the documentation.

相关拉取请求：electron/electron#1984

¥Related Pull Request: electron/electron#1984

最近 Electron 上有一些有趣的更新和讨论，以下是总结。

¥There have been some interesting updates and talks given on Electron recently, here's a roundup.

来源​

¥Source

Electron 现已与 Chrome 45 同步更新（从 v0.32.0 开始）。其他更新包括……

¥Electron is now up to date with Chrome 45 as of v0.32.0. Other updates include...

更完善的文档​

¥Better Documentation

我们已重构并标准化文档，使其更美观、更易读。社区也贡献了文档的翻译版本，例如日语和韩语。

¥We have restructured and standardized the documentation to look better and read better. There are also community-contributed translations of the documentation, like Japanese and Korean.

相关拉取请求：electron/electron#2028, electron/electron#2533, electron/electron#2557, electron/electron#2709, electron/electron#2725, electron/electron#2698, electron/electron#2649.

¥Related pull requests: electron/electron#2028, electron/electron#2533, electron/electron#2557, electron/electron#2709, electron/electron#2725, electron/electron#2698, electron/electron#2649.

Node.js 4.1.0​

自 v0.33.0 以来，Electron 搭载了 Node.js 4.1.0。

¥Since v0.33.0 Electron ships with Node.js 4.1.0.

相关拉取请求：electron/electron#2817。

¥Related pull request: electron/electron#2817.

node-pre-gyp​

现在，从源代码构建时，依赖于 node-pre-gyp 的模块可以针对 Electron 进行编译。

¥Modules relying on node-pre-gyp can now be compiled against Electron when building from source.

相关拉取请求：mapbox/node-pre-gyp#175。

¥Related pull request: mapbox/node-pre-gyp#175.

ARM 支持​

¥ARM Support

Electron 现在提供针对 ARMv7 上的 Linux 的版本。它可以在 Chromebook 和 Raspberry Pi 2 等流行平台上运行。

¥Electron now provides builds for Linux on ARMv7. It runs on popular platforms like Chromebook and Raspberry Pi 2.

相关问题：atom/libchromiumcontent#138, electron/electron#2094, electron/electron#366.

¥Related issues: atom/libchromiumcontent#138, electron/electron#2094, electron/electron#366.

Yosemite 风格的无框窗口​

¥Yosemite-style Frameless Window

已合并 @jaanus 的一个补丁，与其他内置 OS X 应用一样，该补丁允许在 OS X Yosemite 及更高版本上创建带有系统交通信号灯的无框窗口。

¥A patch by @jaanus has been merged that, like the other built-in OS X apps, allows creating frameless windows with system traffic lights integrated on OS X Yosemite and later.

相关拉取请求：electron/electron#2776。

¥Related pull request: electron/electron#2776.

Google 编程夏令营打印支持​

¥Google Summer of Code Printing Support

在 Google Summer of Code 之后，我们合并了 @hokein 的补丁，以改进打印支持，并添加了将页面打印为 PDF 文件的功能。

¥After the Google Summer of Code we have merged patches by @hokein to improve printing support, and add the ability to print the page into PDF files.

相关问题：electron/electron#2677, electron/electron#1935, electron/electron#1532, electron/electron#805, electron/electron#1669, electron/electron#1835.

¥Related issues: electron/electron#2677, electron/electron#1935, electron/electron#1532, electron/electron#805, electron/electron#1669, electron/electron#1835.

Atom​

Atom 现已升级到运行 Chrome 44 的 Electron v0.30.6。atom/atom#8779 正在升级到 v0.33.0。

¥Atom has now upgraded to Electron v0.30.6 running Chrome 44. An upgrade to v0.33.0 is in progress on atom/atom#8779.

讨论​

¥Talks

GitHub 成员 Amy Palamountain 在 Nordic.js 的演讲中对 Electron 进行了精彩的介绍。她还创建了 electron-accelerator 库。

¥GitHubber Amy Palamountain gave a great introduction to Electron in a talk at Nordic.js. She also created the electron-accelerator library.

使用 Electron 构建原生应用，作者：Amy Palomountain​

¥Building native applications with Electron by Amy Palomountain

同样来自 Atom 团队的 Ben Ogle 在 YAPC 亚洲 大会上发表了一篇 Electron 演讲：

¥Ben Ogle, also on the Atom team, gave an Electron talk at YAPC Asia:

使用 Web 技术构建桌面应用，作者：Ben Ogle​

¥Building Desktop Apps with Web Technologies by Ben Ogle

Atom 团队成员 Kevin Sawicki 和其他成员最近在 Bay Are Electron 用户组 聚会上就 Electron 发表了演讲。videos 已发布，以下是一些内容：

¥Atom team member Kevin Sawicki and others gave talks on Electron at the Bay Are Electron User Group meetup recently. The videos have been posted, here are a couple:

Kevin Sawicki 撰写的 Electron 历史​

¥The History of Electron by Kevin Sawicki

Ben Gotow 撰写的《让 Web 应用感觉原生》​

¥Making a web app feel native by Ben Gotow

欢迎参加 9 月 29 日在 GitHub 总部举行的 Electron 聚会，由 Atom 团队成员 @jlord 和 @kevinsawicki 主持。将会有演讲、小吃，以及聚会和与其他使用 Electron 进行精彩活动的人见面的时间。我们还会安排一些时间，为感兴趣的朋友安排一些简短的演讲。希望在那里见到你！

¥Join us September 29th at GitHub's HQ for an Electron meetup hosted by Atom team members @jlord and @kevinsawicki. There will be talks, food to snack on, and time to hangout and meet others doing cool things with Electron. We'll also have a bit of time to do lightning talks for those interested. Hope to see you there!

讨论

¥Talks

• 来自 Jibo 的 Jonathan Ross 和 Francois Laberge 将分享他们如何使用 Electron 制作机器人动画。

  ¥Jonathan Ross and Francois Laberge from Jibo will share how they use Electron to animate a robot.

• Jessica Lord 将分享如何在 Electron 上构建教学工具 Git-it。

  ¥Jessica Lord will talk about building a teaching tool, Git-it, on Electron.

• Tom Moor 将讨论使用 speak.io 在 Electron 上构建视频和屏幕共享功能的利弊。

  ¥Tom Moor will talk about the pros and cons of building video and screen sharing on Electron with speak.io.

• Ben Gotow 将预览 N1：Nylas 邮件客户端 并讨论在 Electron 上开发它。

  ¥Ben Gotow will preview N1: The Nylas Mail Client and talk about developing it on Electron.

细节​

¥Details

• 位置：GitHub 总部，地址：275 Brannan Street, San Francisco, CA, 94107

  ¥Location: GitHub HQ, 275 Brannan Street, San Francisco, CA, 94107

• 日期：2015 年 9 月 29 日，星期二

  ¥Date: Tuesday, September 29th, 2015

• 时间：下午 6 点 - 晚上 9 点

  ¥Time: 6pm - 9pm

• RSVP:ti.to/github-events/electron-meetup