Electron 1.6.3 测试版包含对 macOS 触控栏 的初始支持。

¥The Electron 1.6.3 beta release contains initial support for the macOS Touch Bar.

新的 Touch Bar API 允许你添加按钮、标签、弹出窗口、颜色选择器、滑块和间隔符。这些元素可以动态更新，并且在与它们交互时会触发事件。

¥The new Touch Bar API allows you to add buttons, labels, popovers, color pickers, sliders, and spacers. These elements can be dynamically updated and also emit events when they are interacted with.

这是该 API 的第一个版本，因此它将在接下来的几个 Electron 版本中不断发展。请查看发行说明以获取更多更新，并打开 issues 以查找任何问题或缺失的功能。

¥This is the first release of this API so it will be evolving over the next few Electron releases. Please check out the release notes for further updates and open issues for any problems or missing functionality.

你可以通过 npm install electron@beta 安装此版本，并在 TouchBar 和 BrowserWindow Electron 文档中了解更多信息。

¥You can install this version via npm install electron@beta and learn more about it in the TouchBar and BrowserWindow Electron docs.

非常感谢 @MarshallOfSound 为 Electron 做出贡献。🎉

¥Big thanks to @MarshallOfSound for contributing this to Electron. 🎉

Touch Bar 示例​

¥Touch Bar Example

以下是在触控栏中创建简单老虎机游戏的示例。它演示了如何创建触控栏、设置项目样式、将其与窗口关联、处理按钮点击事件以及动态更新标签。

¥Below is an example of creating a simple slot machine game in the touch bar. It demonstrates how to create a touch bar, style the items, associate it with a window, handle button click events, and update the labels dynamically.

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

const { TouchBarButton, TouchBarLabel, TouchBarSpacer } = TouchBar;

let spinning = false;

// Reel labels
const reel1 = new TouchBarLabel();
const reel2 = new TouchBarLabel();
const reel3 = new TouchBarLabel();

// Spin result label
const result = new TouchBarLabel();

// Spin button
const spin = new TouchBarButton({
  label: '🎰 Spin',
  backgroundColor: '#7851A9',
  click: () => {
    // Ignore clicks if already spinning
    if (spinning) {
      return;
    }

    spinning = true;
    result.label = '';

    let timeout = 10;
    const spinLength = 4 * 1000; // 4 seconds
    const startTime = Date.now();

    const spinReels = () => {
      updateReels();

      if (Date.now() - startTime >= spinLength) {
        finishSpin();
      } else {
        // Slow down a bit on each spin
        timeout *= 1.1;
        setTimeout(spinReels, timeout);
      }
    };

    spinReels();
  },
});

const getRandomValue = () => {
  const values = ['🍒', '💎', '7️⃣', '🍊', '🔔', '⭐', '🍇', '🍀'];
  return values[Math.floor(Math.random() * values.length)];
};

const updateReels = () => {
  reel1.label = getRandomValue();
  reel2.label = getRandomValue();
  reel3.label = getRandomValue();
};

const finishSpin = () => {
  const uniqueValues = new Set([reel1.label, reel2.label, reel3.label]).size;
  if (uniqueValues === 1) {
    // All 3 values are the same
    result.label = '💰 Jackpot!';
    result.textColor = '#FDFF00';
  } else if (uniqueValues === 2) {
    // 2 values are the same
    result.label = '😍 Winner!';
    result.textColor = '#FDFF00';
  } else {
    // No values are the same
    result.label = '🙁 Spin Again';
    result.textColor = null;
  }
  spinning = false;
};

const touchBar = new TouchBar([
  spin,
  new TouchBarSpacer({ size: 'large' }),
  reel1,
  new TouchBarSpacer({ size: 'small' }),
  reel2,
  new TouchBarSpacer({ size: 'small' }),
  reel3,
  new TouchBarSpacer({ size: 'large' }),
  result,
]);

let window;

app.once('ready', () => {
  window = new BrowserWindow({
    frame: false,
    titleBarStyle: 'hidden-inset',
    width: 200,
    height: 200,
    backgroundColor: '#000',
  });
  window.loadURL('about:blank');
  window.setTouchBar(touchBar);
});

本周，我们采访了 Aprile Elcich 和 Paolo Fragomeni，一起探讨了 Voltra，这是一款基于 Electron 的音乐播放器。

¥This week we met with Aprile Elcich and Paolo Fragomeni to talk about Voltra, an Electron-powered music player.

什么是 Voltra？​

¥What is Voltra?

Voltra 是一款音乐播放器，适合想要拥有自己音乐的人。它也是一个商店，你可以根据自己已有的音乐发现和购买新音乐。它无广告，跨平台，适用于桌面和移动设备。它也不会监视你。

¥Voltra is a music player for people who want to own their music. It’s also a store where you can discover and buy new music based on what you already own. It’s ad-free, cross-platform for desktop and mobile. It also doesn’t spy on you.

Voltra 适合谁？​

¥Who is Voltra for?

任何听音乐的人。

¥Anyone who listens to music.

是什么促使你创建 Voltra？​

¥What motivated you to create Voltra?

广播一直拥有大量听众。它正在从广播电视转移到互联网上。现在你可以按需租借音乐了 - 这可是电台的复兴！许多新产品和服务因此应运而生，但流媒体电台仍然控制着你的音乐以及你的体验。

¥Radio has has always had a big share of listeners. It’s moving off the airwaves and onto the Internet. Now you can rent music on demand — it’s a radio revival! A lot of new products and services have emerged because of this, but streaming radio still leaves someone else in control of your music and how you experience it.

我们想要一款完全专注于你拥有的音乐的产品。一些能够让你轻松地直接从艺术家或唱片公司发现和购买新音乐的功能。

¥We wanted a product that was entirely focused on music you own. Something that made it easy to discover and buy new music directly from artists or labels.

有免费版本吗？​

¥Is there a free version?

桌面播放器完全免费。出售你的音乐也是免费的！ 我们不提供广告支持。

¥The desktop player is completely free. Selling your music is also free! We are not ad-supported.

由于该应用是免费的，我们以后可能会将其开源。目前我们没有足够的带宽来管理这些。我们对功能和发展方向也有非常具体的想法。我们有一个活跃的 Beta 测试社区，我们会认真对待大家的反馈。

¥Since the app is free, we may open source it later on. Right now we don’t have the bandwidth to manage that. We also have very specific ideas for features and the direction we want to take things. We have an active beta community and we take our feedback to heart.

你们如何盈利？​

¥How do you make money?

我们有高级功能！

¥We have premium features!

我们的 Voltra 音频存档 是一款专为音乐设计的云备份服务。我们不会压缩或共享数据块。你的音乐收藏已为你备份。

¥Our Voltra Audio Archive is a cloud-backup service designed specifically for music. We don’t compress or share data blocks. Your music collection is physically backed up for you.

对于艺术家和唱片公司，我们的 专业会员 提供工具帮助他们接触更多相关受众，例如分析和专业的艺术家网页。

¥For artists and labels, our Pro Membership offers tools to help them reach more relevant audiences, such as analytics and professional artist webpages.

Voltra 有何不同？​

¥What makes Voltra different?

设计和可用性对我们至关重要。我们希望为听众提供无干扰的聆听体验！还有一些有趣的音乐播放器和商店。但其中许多功能比其创建者意识到的更先进，也更难使用。我们希望让尽可能多的人能够使用 Voltra。

¥Design and usability are incredibly important to us. We want to give listeners a distraction-free listening experience! There are a some interesting music players and stores out there. But many of them are more advanced and harder to use than their creators realize. We want to make Voltra accessible to as many people as possible.

我们也不会从艺术家或厂牌那里收取任何佣金。这对我们来说是一个关键的差异化因素。这非常重要，因为它降低了艺术家将音乐推向市场的门槛。

¥We also don't take a cut from the artist or the label. That’s a key differentiator for us. It’s really important because it lowers the barrier for artists to get their music to market.

你做出了哪些设计和技术决策？​

¥What are some design & technical decisions you made?

在设计 Voltra 时，我们考虑了原生应用和 Web 的 UI 惯例，也仔细考虑了可以移除的内容。我们有一个活跃的私有 Beta 测试小组，在过去几个月里，他们给了我们很多重要的反馈。

¥While designing Voltra, we considered UI conventions from native apps and the web, we also thought a lot about what we could remove. We have an active private beta group who have given us critical feedback over the last few months.

我们发现专辑封面和摄影对人们来说非常重要。许多播放器只是文件列表。拥有实体专辑的一大优势是专辑封面，我们希望在 Voltra 桌面应用中重点强调这一点。

¥We found that album art and photography are really important to people. Many players are just lists of files. One of the cool things about owning physical albums is the album art, and we wanted to put emphasis on this in the Voltra desktop app.

我们也确保不会干扰他人的文件。我们使用文件监视功能，以便你可以将文件放置在任何你想要的位置，我们不会为你重命名或移动它们。我们有一个嵌入式数据库来跟踪被监视目录的状态，这样即使进程未运行，我们也能跟踪最新内容。

¥We also made sure not to mess with people's files. We use file watching so you can put your files wherever you want, and we don't rename them or move them for you. We have an embedded database to track the state of the watched directories so that we can track what's new, even when the process isn't running.

在构建 Voltra 时，你遇到了哪些挑战？​

¥What are some challenges you've faced while building Voltra?

我们花了大量时间专注于性能。我们最初使用框架，但后来转向了原生 JavaScript。根据我们的经验，它们提供的通用抽象远胜于它们带来的性能损失和繁琐的流程。

¥We spend a lot of time focused on performance. We started with frameworks but moved to vanilla Javascript. In our experience, the generalized abstractions they provide outweigh the performance penalties and ceremony that they introduce.

目前，我们可以很好地处理非常大的集合。大型集合意味着可能包含数以万计的图片！在渲染过程中直接使用 Node.js 的文件系统模块，可以非常轻松地基于 DOM 事件快速延迟加载和卸载大量图片。

¥We handle very large collections pretty well at this point. Large collections means possibly tens of thousands of images! Having Node.js’ file system module directly available from the render process made it really easy to lazy load and unload lots of images super quickly based on DOM events.

总的来说，setImmediate 和 requestIdleCallback 是执行大量处理并保持 UI 响应速度的重要工具。更具体地说，将 CPU 密集型任务分配到单独的进程中，确实有助于保持用户界面的响应速度。例如，我们将实际的音频上下文移至单独的进程，并通过 IPC 与其通信，以避免繁忙的 UI 造成潜在的中断。

¥In general setImmediate and requestIdleCallback have been super important tools for performing lots of processing while keeping the UI responsive. More specifically, distributing CPU-bound tasks into separate processes really helps to keep the user interface responsive. For example, we moved the actual audio context into a separate process, communicating with it over IPC to avoid potential interruptions from a busy UI.

为什么选择在 Electron 上构建 Voltra？​

¥Why did you choose to build Voltra on Electron?

浏览器的沙盒对我们的应用而言限制过多。但我们也在开发一个 Web 播放器。因此，我们可以在两种实现之间共享几乎 100% 的代码，这是一个巨大的优势。

¥The browser’s sandbox is too restricted for our app. But we are also developing a web player. So it’s a huge win that we can share almost 100% of the code between the two implementations.

我们实际上是从使用 Swift 构建原生应用开始的。我们发现的主要问题是我们在重复很多事情。Web 拥有世界上最大的开源生态系统。因此，我们很快就转向了 Electron。

¥We actually started by building a native app with Swift. The main problem we found was that we were reinventing a lot of things. The web has the world’s largest open source eco-system. So we pretty quickly switched to Electron.

此外，最重要的是，使用 Electron，你只需开发一次，它就可以在所有主流平台上正常工作™。虽然不能保证，但为每个平台进行原生编码的成本绝对超过了 Electron 带来的任何其他成本。

¥Also, and most importantly, with Electron you develop once and it should Just Work™ on all the major platforms. It’s not guaranteed, but the cost of coding natively for each platform definitely outweighs any other costs that electron introduces.

你最喜欢 Electron 的哪些方面？​

¥What are your favorite things about Electron?

GTD!:将 Node.js 的网络堆栈和 Chromium 的表示层打包在一起，是完成任务的秘诀。

¥GTD!: Having Node.js’ networking stack and Chromium’s presentation layer packaged together is a recipe for getting things done.

权限：这只是一个 Web 栈，所以实际上我们整个团队都参与了产品的构建。

¥Competency: It’s just the web stack, so literally our whole team is involved in actually building the product.

社区：Electron 社区组织严密，善于沟通！我们很高兴能获得这样的支持。

¥Community: There is a highly organized community that knows how to communicate really well! We feel pretty great about developing with support like that.

Electron 可以在哪些方面改进？​

¥In what areas could Electron be improved?

我们希望 Electron 能够支持单一的打包工具。打包程序对 Electron 的重要性，就如同软件包管理器对 Node 一样重要。用户空间中有多个打包器，每个打包器都具有有趣的功能，但也存在一些 bug。社区的共识将有助于引导贡献者投入的精力。

¥We would like to see Electron endorse a single packager. The packager is as important to Electron what the package manager is to Node. There are multiple packagers in user-land, each with interesting features but each with bugs. Consensus by the community would help to direct the energy being spent by contributors.

下一步计划是什么？​

¥What's coming next?

我们目前正在开发一款移动应用，并与艺术家和唱片公司合作，将他们的音乐添加到 Voltra 商店。大家好！如果你是艺术家或唱片公司，立即注册！我们计划在达到 1000 万首曲目的目标后开放商店。

¥We‘re currently developing a mobile app, and working with artists and labels to add their music to the Voltra shop. Hey! If you’re an artist or label, sign up now! We plan on opening up the shop when we reach our goal of 10 million tracks.

Electron 基于 Google 的开源 Chromium 项目，该项目的设计目的并非供其他项目使用。本文介绍了如何将 Chromium 构建为 Electron 使用的库，以及构建系统多年来的发展历程。

¥Electron is based on Google's open-source Chromium, a project that is not necessarily designed to be used by other projects. This post introduces how Chromium is built as a library for Electron's use, and how the build system has evolved over the years.

使用 CEF​

¥Using CEF

Chromium 嵌入式框架 (CEF) 是一个将 Chromium 转变为库的项目，并基于 Chromium 的代码库提供稳定的 API。Atom 编辑器和 NW.js 的早期版本使用了 CEF。

¥The Chromium Embedded Framework (CEF) is a project that turns Chromium into a library, and provides stable APIs based on Chromium's codebase. Very early versions of Atom editor and NW.js used CEF.

为了维护稳定的 API，CEF 隐藏了 Chromium 的所有细节，并用自己的接口封装了 Chromium 的 API。因此，当我们需要访问底层 Chromium API（例如将 Node.js 集成到网页中）时，CEF 的优势就变成了阻碍。

¥To maintain a stable API, CEF hides all the details of Chromium and wraps Chromium's APIs with its own interface. So when we needed to access underlying Chromium APIs, like integrating Node.js into web pages, the advantages of CEF became blockers.

因此，最终 Electron 和 NW.js 都切换到直接使用 Chromium 的 API。

¥So in the end both Electron and NW.js switched to using Chromium's APIs directly.

作为 Chromium 的一部分构建​

¥Building as part of Chromium

尽管 Chromium 官方不支持外部项目，但其代码库是模块化的，基于 Chromium 构建一个极简浏览器很容易。提供浏览器界面的核心模块称为内容模块。

¥Even though Chromium does not officially support outside projects, the codebase is modular and it is easy to build a minimal browser based on Chromium. The core module providing the browser interface is called Content Module.

要使用内容模块开发项目，最简单的方法是将项目构建为 Chromium 的一部分。此操作可以通过首先检出 Chromium 的源代码，然后将项目添加到 Chromium 的 DEPS 文件中来完成。

¥To develop a project with Content Module, the easiest way is to build the project as part of Chromium. This can be done by first checking out Chromium's source code, and then adding the project to Chromium's DEPS file.

NW.js 和 Electron 的早期版本都使用这种方式进行构建。

¥NW.js and very early versions of Electron are using this way for building.

缺点是，Chromium 的代码库非常庞大，需要非常强大的机器才能构建。对于普通注意本电脑来说，这可能需要 5 个多小时。因此，这极大地影响了能够为项目做出贡献的开发者数量，也降低了开发速度。

¥The downside is, Chromium is a very large codebase and requires very powerful machines to build. For normal laptops, that can take more than 5 hours. So this greatly impacts the number of developers that can contribute to the project, and it also makes development slower.

将 Chromium 构建为单个共享库​

¥Building Chromium as a single shared library

作为内容模块的用户，Electron 在大多数情况下不需要修改 Chromium 的代码，因此改进 Electron 构建的一个显而易见的方法是将 Chromium 构建为共享库，然后在 Electron 中链接它。这样，开发者在为 Electron 做贡献时，就不再需要完全依赖 Chromium 进行构建。

¥As a user of Content Module, Electron does not need to modify Chromium's code under most cases, so an obvious way to improve the building of Electron is to build Chromium as a shared library, and then link with it in Electron. In this way developers no longer need to build all off Chromium when contributing to Electron.

libchromiumcontent 项目是由 @aroben 为此创建的。它将 Chromium 的内容模块构建为共享库，然后提供 Chromium 的头文件和预构建的二进制文件供下载。libchromiumcontent 初始版本的代码可在 在此链接中 找到。

¥The libchromiumcontent project was created by @aroben for this purpose. It builds the Content Module of Chromium as a shared library, and then provides Chromium's headers and prebuilt binaries for download. The code of the initial version of libchromiumcontent can be found in this link.

brightray 项目也是 libchromiumcontent 的一部分，libchromiumcontent 围绕内容模块提供了一个薄层。

¥The brightray project was also born as part of libchromiumcontent, which provides a thin layer around Content Module.

通过结合使用 libchromiumcontent 和 brightray，开发者可以快速构建浏览器，而无需深入了解 Chromium 的构建细节。它消除了构建项目对快速网络和强大机器的要求。

¥By using libchromiumcontent and brightray together, developers can quickly build a browser without getting into the details of building Chromium. And it removes the requirement of a fast network and powerful machine for building the project.

除了 Electron 之外，还有其他基于 Chromium 的项目以这种方式构建，例如 浏览器漏洞。

¥Apart from Electron, there were also other Chromium-based projects built in this way, like the Breach browser.

过滤导出的符号​

¥Filtering exported symbols

在 Windows 上，一个共享库可以导出的符号数量存在限制。随着 Chromium 代码库的增长，libchromiumcontent 中导出的符号数量很快就超出了限制。

¥On Windows there is a limitation of how many symbols one shared library can export. As the codebase of Chromium grew, the number of symbols exported in libchromiumcontent soon exceeded the limitation.

解决方案是在生成 DLL 文件时过滤掉不需要的符号。它在 向链接器提供 .def 文件 版本中运行，然后使用脚本升级到 判断命名空间下的符号是否应该导出 版本。

¥The solution was to filter out unneeded symbols when generating the DLL file. It worked by providing a .def file to the linker, and then using a script to judge whether symbols under a namespace should be exported.

通过采用这种方法，尽管 Chromium 不断添加新的导出符号，但 libchromiumcontent 仍然可以通过剥离更多符号来生成共享库文件。

¥By taking this approach, though Chromium kept adding new exported symbols, libchromiumcontent could still generate shared library files by stripping more symbols.

组件构建​

¥Component build

在讨论 libchromiumcontent 的后续步骤之前，首先介绍一下 Chromium 中的组件构建概念。

¥Before talking about the next steps taken in libchromiumcontent, it is important to introduce the concept of component build in Chromium first.

作为一个庞大的项目，在 Chromium 中构建时，链接步骤会花费很长时间。通常，开发者进行小改动后，可能需要 10 分钟才能看到最终输出。为了解决这个问题，Chromium 引入了组件构建功能，它将 Chromium 中的每个模块构建为独立的共享库，因此最终链接步骤所花费的时间变得微不足道。

¥As a huge project, the linking step takes very long in Chromium when building. Normally when a developer makes a small change, it can take 10 minutes to see the final output. To solve this, Chromium introduced component build, which builds each module in Chromium as separated shared libraries, so the time spent in the final linking step becomes unnoticeable.

发送原始二进制文件​

¥Shipping raw binaries

随着 Chromium 的不断发展，Chromium 中导出的符号非常多，甚至内容模块和 Webkit 的符号也超出了限制。仅仅通过剥离符号是不可能生成可用的共享库的。

¥With Chromium continuing to grow, there were so many exported symbols in Chromium that even the symbols of Content Module and Webkit were more than the limitation. It was impossible to generate a usable shared library by simply stripping symbols.

最终，我们不得不使用 发布 Chromium 原始二进制文件，而不是生成单个共享库。

¥In the end, we had to ship the raw binaries of Chromium instead of generating a single shared library.

如前所述，Chromium 有两种构建模式。由于需要发布原始二进制文件，我们必须在 libchromiumcontent 中发布两个不同的二进制发行版。一个版本称为 static_library 构建，它包含 Chromium 常规构建生成的每个模块的所有静态库。另一种方法是 shared_library，它包含组件构建生成的每个模块的所有共享库。

¥As introduced earlier there are two build modes in Chromium. As a result of shipping raw binaries, we have to ship two different distributions of binaries in libchromiumcontent. One is called static_library build, which includes all static libraries of each module generated by the normal build of Chromium. The other is shared_library, which includes all shared libraries of each module generated by the component build.

在 Electron 中，调试版本与 libchromiumcontent 的 shared_library 版本链接，因为它下载量小，并且链接最终可执行文件所需的时间很短。Electron 的 Release 版本与 libchromiumcontent 的 static_library 版本链接，因此编译器可以生成对调试至关重要的完整符号，并且链接器可以进行更好的优化，因为它知道哪些目标文件是必需的，哪些不是。

¥In Electron, the Debug version is linked with the shared_library version of libchromiumcontent, because it is small to download and takes little time when linking the final executable. And the Release version of Electron is linked with the static_library version of libchromiumcontent, so the compiler can generate full symbols which are important for debugging, and the linker can do much better optimization since it knows which object files are needed and which are not.

因此，对于常规开发，开发者只需构建调试版本，这不需要良好的网络或强大的设备。虽然发布版本需要更好的硬件来构建，但它可以生成更优化的二进制文件。

¥So for normal development, developers only need to build the Debug version, which does not require a good network or powerful machine. Though the Release version then requires much better hardware to build, it can generate better optimized binaries.

gn 更新​

¥The gn update

作为世界上最大的项目之一，大多数常规系统并不适合构建 Chromium，因此 Chromium 团队开发了自己的构建工具。

¥Being one of the largest projects in the world, most normal systems are not suitable for building Chromium, and the Chromium team develops their own build tools.

早期版本的 Chromium 使用 gyp 作为构建系统，但它速度慢，而且其配置文件对于复杂项目来说难以理解。经过多年的开发，Chromium 已改用 gn 作为构建系统，它速度更快，架构更清晰。

¥Earlier versions of Chromium were using gyp as a build system, but it suffers from being slow, and its configuration file becomes hard to understand for complex projects. After years of development, Chromium switched to gn as a build system, which is much faster and has a clear architecture.

gn 的一项改进是引入了 source_set，它代表一组目标文件。在 gyp 中，每个模块都由 static_library 或 shared_library 表示；对于 Chromium 的正常构建，每个模块都会生成一个静态库，并在最终的可执行文件中将它们链接在一起。通过使用 gn，每个模块现在只生成一堆目标文件，最终的可执行文件只需将所有目标文件链接在一起，因此不再生成中间静态库文件。

¥One of the improvements of gn is to introduce source_set, which represents a group of object files. In gyp, each module was represented by either static_library or shared_library, and for the normal build of Chromium, each module generated a static library and they were linked together in the final executable. By using gn, each module now only generates a bunch of object files, and the final executable just links all the object files together, so the intermediate static library files are no longer generated.

然而，这项改进给 libchromiumcontent 带来了很大的麻烦，因为 libchromiumcontent 实际上需要中间静态库文件。

¥This improvement however made great trouble to libchromiumcontent, because the intermediate static library files were actually needed by libchromiumcontent.

解决这个问题的第一次尝试是 补丁 gn 以生成静态库文件，它解决了问题，但远非一个理想的解决方案。

¥The first try to solve this was to patch gn to generate static library files, which solved the problem, but was far from a decent solution.

第二次尝试是由 @alespergl 到 从目标文件列表生成自定义静态库 进行的。它使用了一个技巧，首先运行一个虚拟构建来收集生成的目标文件列表，然后通过将列表提供给 gn 来实际构建静态库。它只对 Chromium 的源代码进行了微小的更改，并保留了 Electron 的构建架构。

¥The second try was made by @alespergl to produce custom static libraries from the list of object files. It used a trick to first run a dummy build to collect a list of generated object files, and then actually build the static libraries by feeding gn with the list. It only made minimal changes to Chromium's source code, and kept Electron's building architecture still.

概括​

¥Summary

如你所见，与将 Electron 构建为 Chromium 的一部分相比，将 Chromium 构建为库需要付出更多努力，并且需要持续维护。但是后者消除了构建 Electron 对强大硬件的要求，从而使更多开发者能够构建 Electron 并为其做出贡献。这些努力完全值得。

¥As you can see, compared to building Electron as part of Chromium, building Chromium as a library takes greater efforts and requires continuous maintenance. However the latter removes the requirement of powerful hardware to build Electron, thus enabling a much larger range of developers to build and contribute to Electron. The effort is totally worth it.

本周，我们采访了 Automattic 的同事，一起探讨了 WordPress 桌面版。这是一款用于管理 WordPress 内容的开源桌面客户端。

¥This week we caught up with folks at Automattic to talk about WordPress Desktop, an open-source desktop client for managing WordPress content.

大家都知道 WordPress，但 WordPress 桌面版是什么呢？​

¥Everyone knows about WordPress, but what is WordPress Desktop?

WordPress.com 桌面应用 提供无缝的跨平台体验，让你可以专注于内容和设计，而不会被浏览器标签页分散注意力，或者让你的网站保持边缘化但仍然可访问。结合我们的浏览器支持和移动应用，你可以在任何地方以任何有助于你完成工作的方式构建你的网站。

¥The WordPress.com Desktop app provides a seamless cross-platform experience that allows you to focus on your content and design with no browser tabs to distract you — or to keep your sites sidelined but accessible. In combination with our browser support and mobile app you can build your site anywhere, in whatever way helps you get your work done.

为什么要构建一个用于管理 WordPress 网站的桌面应用？难道不能全部基于 Web 吗？​

¥Why build a Desktop app for managing WordPress sites? Couldn't it all be web-based?

它实际上使用的技术与你在浏览器中访问 WordPress.com 时使用的技术完全相同。然而，它全部在本地托管，因此加载时间极短。借助原生功能（例如在 Dock 中显示、通知等），你可以真正专注于 WordPress 网站和博客。

¥It's actually using exactly the same technology you get when visiting WordPress.com in your browser. However, it's all locally hosted, so it has minimal load times. With the benefit of native features such as being in your dock, notifications, etc., you really can focus on your WordPress sites and blogging.

为什么选择在 Electron 上构建 WordPress 桌面？​

¥Why did you choose to build WordPress Desktop on Electron?

2015 年底，我们以 Calypso 的形式重建了 WordPress.com 的大部分内容，Calypso 是一个使用 React 的开源现代 JavaScript 应用。我们开始研究 Electron，并对 Calypso 进行了一些修改，使其能够在本地运行。这是一个引人入胜的体验，我们认为进一步开发它具有很大的价值。

¥At the end of 2015 we rebuilt much of WordPress.com in the form of Calypso, an open-source modern JavaScript app using React. We started looking at Electron and with some changes to Calypso were able to get it running locally. It was a compelling experience and we thought there was a lot of value in developing it further.

我们有几个团队在开发 Calypso。如果使用传统的桌面技术来制作一个完整的多平台 GUI 客户端，需要做更多的工作。通过使用 Electron，我们一个由 2-4 人组成的小团队能够利用其他团队的努力，在几个月内构建桌面应用。

¥We had several teams working on Calypso. To make a full multi-platform GUI client that matched this using traditional desktop technologies would have taken more work. By using Electron, a small team of 2-4 of us were able to leverage the other team’s efforts and build the Desktop app in a couple of months.

在构建 WordPress Desktop 时，你遇到了哪些挑战？​

¥What are some challenges you've faced while building WordPress Desktop?

我们很快就让该应用的初始版本运行起来，但将其调整为桌面应用的最佳运行方式则花费了更多时间。该应用的一大挑战是你实际上是在自己的机器上运行 Calypso 的副本。 - 它纯粹是一个由 API 驱动的 UI。这其中涉及大量的衔接工作，并将更改反馈给了 Calypso 本身。

¥We got an initial version of the app running very quickly, but tuning it to behave optimally as a desktop app took a lot more time. One big challenge with the app is that you're actually running a copy of Calypso on your own machine - it’s purely an API driven UI. There was a lot of bridging work involved in this, and changes were fed back to Calypso itself.

此外，我们投入了大量精力为不同平台打包应用。 - 我们提供 Windows、macOS 和 Linux 版本 - 并且存在足够的差异，使得这个问题变得棘手。

¥Additionally a lot of effort was spent packaging the app for different platforms - we provide Windows, macOS, and Linux versions - and there are sufficient differences to make this tricky.

当时 Electron 相对较新，我们不断遇到一些问题，这些问题很快就得到了解决（有时甚至当天就能解决！）。

¥At the time Electron was relatively new and we kept running into issues that were shortly fixed (sometimes the same day!)

Electron 应该在哪些方面改进？​

¥In what areas should Electron be improved?

Electron 已经提供了我们桌面应用所需的大部分功能，并且自我们开始使用它以来，它一直在快速发展。话虽如此，桌面应用中有些功能是理所当然的，例如拼写检查和查找/替换，在 Electron 中很难照搬。

¥Electron already provides most of what we need for the Desktop app, and it's progressed rapidly since we started using it. That said, there are some areas that are taken for granted in a desktop app, such as spell checking and find/replace, that are harder to replicate with Electron as-is.

我们也希望看到一些较新的 Chrome 技术也能融入到 Electron 中。我们尤其热衷于尝试 WebVR。

¥We’d also love to see some of the newer Chrome technologies filtering down into Electron too. We’re particularly keen on experimenting with WebVR.

你最喜欢 Electron 的哪些方面？​

¥What are your favorite things about Electron?

我们选择 Electron 的主要原因，也是它最大的优势，是其非常活跃和开放的社区。Automattic 始终坚信开源。这是我们的核心原则之一，Electron 项目和社区也遵循许多非常开放和积极的核心信念。

¥The main reason we chose Electron, and it's biggest strength, is the very active and open community. Automattic has always believed in open source. It is one of our core tenets, and the Electron project and community follows a lot of the core beliefs of being very open and positive.

WordPress Desktop 的下一步计划是什么？​

¥What's coming next in WordPress Desktop?

我们模型的优点在于桌面应用可以从任何新的 Calypso 功能中受益。 - 我们不断改进。我们希望能够为该应用添加更多功能，例如离线支持（这将真正使该应用进入原生字段）以及更好的系统通知。

¥The great thing about our model is that the Desktop app benefits from any new Calypso feature - there are constant improvements. We’re hoping we can add additional features to the app such as offline support, which would really take the app into native territory, and better system notifications.

Automattic 是否有团队正在开发其他 Electron 应用？​

¥Are there any teams at Automattic working on other Electron apps?

是的，在我们努力开发桌面应用之后，Simplenote 团队决定使用 Electron 构建适用于 Windows 和 Linux 的桌面应用（原生 Mac 客户端已存在）。Simplenote Electron 应用 也是开源的，可在 Github 上获取。

¥Yes, after our efforts on the Desktop app, the Simplenote team decided to use Electron to build desktop apps for Windows and Linux (a native Mac client already exists). The Simplenote Electron app is also open source and available on Github.

我们还即将推出使用 Electron 的 Raspberry Pi 集成。

¥We've also got an upcoming Raspberry Pi integration that uses Electron.

如果其中任何一个听起来有趣，那么我们就使用 期待你的反馈！

¥If any of that sounds interesting then we'd love to hear from you!

有哪些 Electron 开发技巧可能对其他开发者有用？​

¥Any Electron tips that might be useful to other developers?

发布已签名桌面软件的过程对我们来说相对较新，尤其是在 Windows 平台上。我们为 Windows 应用代码签名 撰写了一篇文章，其中包含了整个过程以及我们为了做好这项工作所遇到的一些困难。

¥The process of shipping signed desktop software is relatively new to us, especially for Windows. we wrote up an article for Code Signing a Windows App which includes the process and a few of the hurdles we went through to do it right.

本周的重点项目是 Dat，这是一个基于 grant-funded 的开源去中心化数据集分发工具。Dat 由 地理分布式团队 构建和维护，其中许多人参与了本文的撰写。

¥This week's featured project is Dat, a grant-funded, open source, decentralized tool for distributing data sets. Dat is built and maintained by a geodistributed team, many of whom helped write this post.

首先，什么是 Dat？​

¥First off what is Dat?

我们希望将点对点和分布式系统的最佳部分引入数据共享。我们最初从科学数据共享开始，然后逐渐扩展到研究机构、政府、公共服务和开源团队。

¥We wanted to bring the best parts of peer to peer and distributed systems to data sharing. We started with scientific data sharing and then began branching out into research institutions, government, public service, and open source teams as well.

另一种思考方式是将其想象成一个同步和上传应用，例如 Dropbox 或 BitTorrent Sync，只不过 Dat 是 开源。我们的目标是成为一款功能强大、开源、非盈利的数据共享软件，适用于大数据、小型数据、中型数据、小批量数据和大批量数据。

¥Another way to think about it is a sync and upload app like Dropbox or BitTorrent Sync, except Dat is open source. Our goal is to be a a powerful, open source, non-profit data sharing software for big, small, medium, small-batch and big-batch data.

要使用 dat CLI 工具，你只需输入以下内容：

¥To use the dat CLI tool, all you have to type is:

dat share path/to/my/folder

dat 将创建一个链接，你可以使用该链接将该文件夹发送给其他人 - 任何中央服务器或第三方都无法访问你的数据。与 BitTorrent 不同，它也无法嗅探谁在共享什么内容 (查看 Dat Paper 草稿了解更多详情)。

¥And dat will create a link that you can use to send that folder to someone else -- no central servers or third parties get access to your data. Unlike BitTorrent, it's also impossible to sniff who is sharing what (see the Dat Paper draft for more details).

现在我们知道 Dat 是什么了。Dat Desktop 如何融入其中？​

¥Now we know what Dat is. How does Dat Desktop fit in?

Dat 桌面 是一种让无法或不愿使用命令行的人也能访问 Dat 的方法。你可以在你的机器上托管多个数据，并通过网络提供数据。

¥Dat Desktop is a way to make Dat accessible to people who can't or don't want to use the command line. You can host multiple dats on your machine and serve the data over your network.

你能分享一些有趣的用例吗？​

¥Can you share some cool use cases?

DataRefuge + Svalbard 项目​

¥DataRefuge + Project Svalbard

我们正在开发一个代号为 Svalbard 项目 的项目，它与 DataRefuge 相关，DataRefuge 是一个致力于备份濒临消失的政府气候数据的小组。“斯瓦尔巴群岛”以位于北极的斯瓦尔巴全球种子库命名，该种子库拥有一个大型地下植物 DNA 备份库。我们的版本是一个大型的公共科学数据集的版本控制集合。一旦我们了解并信任元数据，我们就可以构建其他很酷的项目，例如 分布式志愿者数据存储网络。

¥We're working on a thing codenamed Project Svalbard that is related to DataRefuge, a group working to back up government climate data at risk of disappearing. Svalbard is named after the Svalbard Global Seed Vault in the Arctic which has a big underground backup library of plant DNA. Our version of it is a big version controlled collection of public scientific datasets. Once we know and can trust the metadata, we can build other cool projects like a distributed volunteer data storage network.

加州公民数据联盟​

¥California Civic Data Coalition

CACivicData 是一个开源档案库，提供从加州政治资金追踪数据库 CAL-ACCESS 的每日下载。它们使用 每日发布，这意味着它们的 zip 文件中会包含大量重复数据。我们正在努力将他们的数据托管为 Dat 存储库，这将减少引用特定版本或更新到新版本所需的麻烦和带宽。

¥CACivicData is an open-source archive serving up daily downloads from CAL-ACCESS, California's database tracking money in politics. They do daily releases, which means hosting a lot of duplicate data across their zip files. We're working on hosting their data as a Dat repository which will reduce the amount of hassle and bandwidth needed to refer to specific version or update to a newer version.

Electron 更新​

¥Electron Updates

这一点目前尚未具体化，但我们认为一个有趣的用例是将编译好的 Electron 应用放入 Dat 仓库中，然后使用 Electron 中的 Dat 客户端拉取构建应用二进制文件的最新增量版本，以节省下载时间，同时也降低服务器的带宽成本。

¥This one isn't concrete yet, but we think a fun use case would be putting a compiled Electron app in a Dat repository, then using a Dat client in Electron to pull the latest deltas of the built app binary, to save on download time but also to reduce bandwidth costs for the server.

谁应该使用 Dat Desktop？​

¥Who should be using Dat Desktop?

任何想要通过 P2P 网络共享和更新数据的人。数据科学家、开放数据黑客、研究人员、开发者。如果有人提出我们尚未想到的精彩用例，我们非常乐意接受反馈。你可以访问我们的 Gitter 聊天 并向我们咨询任何问题！

¥Anyone who wants to share and update data over a p2p network. Data scientists, open data hackers, researchers, developers. We're super receptive to feedback if anyone has a cool use case we haven't thought of yet. You can drop by our Gitter Chat and ask us anything!

Dat 和 Dat Desktop 的下一步计划是什么？​

¥What's coming next in Dat and Dat Desktop?

用户账户和元数据发布。我们正在开发一个 Dat 注册表 Web 应用，该应用将部署在 datproject.org，本质上相当于 '用于数据集的 NPM'，但需要注意的是，我们只是将其作为元数据目录，数据可以存储在任何在线位置（这与 NPM 或 GitHub 不同，因为 NPM 或 GitHub 将所有数据都集中托管，因为源代码足够小，你可以将所有数据都放在一个系统中）。由于许多数据集非常庞大，我们需要一个联合注册表（类似于 BitTorrent 追踪器的工作方式）。我们希望人们能够轻松地使用 Dat Desktop 中的注册表查找或发布数据集，从而使数据共享过程顺畅无阻。

¥User accounts and metadata publishing. We are working on a Dat registry web app to be deployed at datproject.org which will basically be an 'NPM for datasets', except the caveat being we are just going to be a metadata directory and the data can live anywhere online (as opposed to NPM or GitHub where all the data is centrally hosted, because source code is small enough you can fit it all in one system). Since many datasets are huge, we need a federated registry (similar to how BitTorrent trackers work). We want to make it easy for people to find or publish datasets with the registry from Dat Desktop, to make the data sharing process frictionless.

另一个功能是多写入/协作文件夹。我们有一个宏伟的计划，希望实现协作工作流，或许可以使用类似于 Git 的分支，但设计时要围绕数据集协作。但我们目前仍在致力于整体稳定性和协议标准化！

¥Another feature is multi-writer/collaborative folders. We have big plans to do collaborative workflows, maybe with branches, similar to git, except designed around dataset collaboration. But we're still working on overall stability and standardizing our protocols right now!

为什么选择在 Electron 上构建 Dat 桌面？​

¥Why did you choose to build Dat Desktop on Electron?

Dat 使用 Node.js 构建，因此非常适合我们的集成。除此之外，由于科学家、研究人员和政府官员可能被迫为其机构使用某些设置，因此我们的用户使用各种各样的机器 - 这意味着我们需要能够针对 Windows、Linux 和 Mac 进行开发。Dat Desktop 让我们轻松实现了这一点。

¥Dat is built using Node.js, so it was a natural fit for our integration. Beyond this, our users use a variety of machines since scientists, researchers and government officials may be forced to use certain setups for their institutions -- this means we need to be able to target Windows and Linux as well as Mac. Dat Desktop gives us that quite easily.

在构建 Dat 和 Dat Desktop 时，你遇到了哪些挑战？​

¥What are some challenges you've faced while building Dat and Dat Desktop?

搞清楚用户的需求。我们最初从表格数据集开始，但我们意识到这是一个有点复杂的问题，而且大多数人并不使用数据库。因此，在项目进行到一半时，我们从头开始重新设计了所有内容，以便使用文件系统，并且从未回头。

¥Figuring out what people want. We started with tabular datasets, but we realized that it was a bit of a complicated problem to solve and that most people don't use databases. So half way through the project, we redesigned everything from scratch to use a filesystem and haven't looked back.

我们也遇到了一些常见的 Electron 基础设施问题，包括：

¥We also ran into some general Electron infrastructure problems, including:

• 遥测 - 如何捕获匿名使用情况统计信息

  ¥Telemetry - how to capture anonymous usage statistics

• 更新 - 设置自动更新有点零碎，但很神奇。

  ¥Updates - It's kind of piecemeal and magic to set up automatic updates

• 发布 - XCode 签名、在 Travis 上构建版本、进行 Beta 版本构建，所有这些都是挑战。

  ¥Releases - XCode signing, building releases on Travis, doing beta builds, all were challenges.

我们还在 Dat Desktop 的 '前端' 代码上使用了 Browserify 和一些很酷的 Browserify Transforms（这有点奇怪，因为即使我们有原生的 require，我们仍然会打包 - 但这是因为我们想要这些 Transforms）。为了更好地管理 CSS，我们从 Sass 切换到使用 sheetify。它极大地帮助我们模块化了 CSS，并使我们的 UI 更容易迁移到具有共享依赖的面向组件架构。例如，dat-colors 包含我们所有的颜色，并在我们所有的项目之间共享。

¥We also use Browserify and some cool Browserify Transforms on the 'front end' code in Dat Desktop (which is kind of weird because we still bundle even though we have native require -- but it's because we want the Transforms). To better help manage our CSS we switched from Sass to using sheetify. It's greatly helped us modularize our CSS and made it easier to move our UI to a component oriented architecture with shared dependencies. For example dat-colors contains all of our colors and is shared between all our projects.

我们一直是标准和极简抽象的忠实拥护者。我们的整个界面使用常规 DOM 节点和一些辅助库构建。我们已经开始将其中一些组件迁移到 base-elements，这是一个低级可复用组件库。与我们的大多数技术一样，我们不断迭代，直到完美为止，但作为一个团队，我们感觉我们正朝着正确的方向前进。

¥We've always been a big fan of standards and minimal abstractions. Our whole interface is built using regular DOM nodes with just a few helper libraries. We've started to move some of these components into base-elements, a library of low-level reusable components. As with most of our technology we keep iterating on it until we get it right, but as a team we have a feeling we're heading in the right direction here.

Electron 应该在哪些方面改进？​

¥In what areas should Electron be improved?

我们认为最大的痛点是原生模块。必须使用 npm 为 Electron 重新构建模块会增加工作流程的复杂性。我们的团队开发了一个名为 prebuild 的模块，用于处理预构建的二进制文件，该模块在 Node 上运行良好，但 Electron 工作流程在安装后仍然需要自定义步骤，通常是 npm run rebuild。之前有点烦人。为了解决这个问题，我们最近改用了一种策略，将所有平台的所有编译二进制版本都打包到 npm tarball 中。这意味着 tarball 会变得更大（尽管可以使用 .so 文件（共享库）进行优化），这种方法避免了运行安装后脚本，也完全避免了 npm run rebuild 模式。这意味着 npm install 第一次就为 Electron 做了正确的事。

¥We think the biggest pain point is native modules. Having to rebuild your modules for Electron with npm adds complexity to the workflow. Our team developed a module called prebuild which handles pre-built binaries, which worked well for Node, but Electron workflows still required a custom step after installing, usually npm run rebuild. It was annoying. To address this we recently switched to a strategy where we bundle all compiled binary versions of all platforms inside the npm tarball. This means tarballs get larger (though this can be optimized with .so files - shared libraries), this approach avoids having to run post-install scripts and also avoids the npm run rebuild pattern completely. It means npm install does the right thing for Electron the first time.

你最喜欢 Electron 的哪些方面？​

¥What are your favorite things about Electron?

这些 API 似乎经过深思熟虑，相对稳定，并且能够很好地与上游 Node 版本保持同步，除此之外，我们没什么可要求的了！

¥The APIs seem fairly well thought out, it's relatively stable, and it does a pretty good job at keeping up to date with upstream Node releases, not much else we can ask for!

有哪些 Electron 开发技巧可能对其他开发者有用？​

¥Any Electron tips that might be useful to other developers?

如果你使用原生模块，不妨试试 prebuild！

¥If you use native modules, give prebuild a shot!

关注 Dat 开发的最佳方式是什么？​

¥What's the best way to follow Dat developments?

在 Twitter 上关注 @dat_project，或订阅我们的 邮件简报。

¥Follow @dat_project on Twitter, or subscribe to our email newsletter.

本周，我们采访了 Felix Rieseberg，他是 Slack 的桌面工程师，也是 Ghost 桌面（Ghost 发布平台的 Electron 客户端）的维护者。

¥This week we chatted with Felix Rieseberg, desktop engineer at Slack and maintainer of Ghost Desktop, an Electron client for the Ghost publishing platform.

什么是 Ghost？​

¥What is Ghost?

Ghost 是一个完全开源、可破解的平台，用于构建和运行现代在线发布物。我们为从 Zappos 到 Sky News 等博客、杂志和报告器提供支持。

¥Ghost is a fully open source, hackable platform for building and running a modern online publication. We power blogs, magazines and journalists from Zappos to Sky News.

它与其他发布平台有何不同？​

¥What makes it different from other publishing platforms?

Ghost 成立于 2013 年 4 月，此前在 Kickstarter 众筹中取得了巨大成功，旨在打造一个专注于专业发布的新平台。我们的使命是为全球独立报告器和作家打造最佳的开源工具，并对在线媒体的未来产生真正的影响。它提供了更简单、更专注的体验：我们的编辑器旨在提供最佳的写作体验。

¥Ghost was founded in April 2013, after a very successful Kickstarter campaign to create a new platform focused solely on professional publishing. Our mission is to create the best open source tools for independent journalists and writers across the world, and have a real impact on the future of online media. It offers a simpler, more focussed experience: Our editor is designed solely around providing the best possible writing experience.

与经典的 WordPress 相比，它提供了更简洁、更流畅的体验。 - 它更易于设置和维护，所有重要功能开箱即用，并且速度显著提升。与其他在线平台相比，Ghost 赋予作者对其内容的完全所有权和控制权，允许完全自定义，并允许作者围绕其发布物开展业务。

¥Compared to the all-time classic WordPress, it offers a simpler, more streamlined experience - it is easier to setup and maintain, comes with all important features out-of-the-box, and is dramatically faster. Compared to other online platforms, Ghost gives writers full ownership and control over their content, allows full customization, and enables authors to build a business around their publication.

Ghost 是一家盈利性公司吗？​

¥Is Ghost a for-profit company?

这一点对我们很重要：Ghost 是一个独立的非营利组织。我们为现代新闻和博客构建发布工具，因为我们相信言论自由至关重要。我们的软件基于 免费开源许可证 发行，我们的商业模式是 完全透明，我们的法律架构意味着我们赚到的所有钱都会重新投资于 Ghost 的改进。

¥This one is important to us: Ghost is an independent non-profit organisation. We build publishing tools for modern journalism & blogging because we believe freedom of speech is important. Our software is released under a free open source license, our business model is completely transparent, and our legal structure means that 100% of the money we make is reinvested into making Ghost better.

什么是 Ghost Desktop？​

¥What is Ghost Desktop?

Ghost Desktop 允许作者同时管理多个博客 - 并专注于他们的写作。一些简单的功能，例如常用的书写快捷键，无法在浏览器中实现，但可以在我们的桌面应用中使用。它允许其他应用直接与 通过深度链接访问博客 通信。

¥Ghost Desktop allows writers to manage multiple blogs at once - and to focus on their writing. Simple things like common writing shortcuts can't be realized in a browser, but are available in our desktop app. It allows other applications to communicate directly with the blog via deeplinks.

什么是 Ghost for Journalism？​

¥What is Ghost for Journalism?

今年，我们非常高兴地将我们 10 人的全职 Ghost 团队投入到帮助发展三家独立发布物的工作中，并为他们提供 45,000 美元的资源。我们称之为 Ghost 新闻报道。

¥This year we're very excited to be dedicating our entire 10 person full-time Ghost team to helping grow three independent publications, along with $45,000 in resources toward their efforts. We're calling it Ghost for Journalism.

大约三年半以来，我们一直在将 Ghost 打造为面向独立发布商的下一个优秀网络平台，现在我们已经到达了一个非常有趣的转折点。我们开始这段旅程是为了创建一个简单、设计精良、几乎任何人都可以使用的博客平台。这始终是第一步。

¥We've been building Ghost as the web's next great platform for independent publishers for about three and half years now, and we've now reached a really interesting inflection point. We started this journey to create a simple, well designed blogging platform which could be used by just about anyone. That was always going to be step one.

从长远来看，我们希望 Ghost 成为全球顶尖新闻工作者的卓越平台，这意味着我们需要构建能够吸引这些人才的功能。今年我们非常有意识地决定专注于此。

¥Long term, we want Ghost to be an incredible platform for the world's best journalism, and that means we need to build features to attract exactly those people. This year we're making a very conscious decision to focus on just that.

为什么选择在 Electron 上构建 Ghost 桌面？​

¥Why did you choose to build Ghost Desktop on Electron?

Ghost 在后端和前端都使用 JavaScript 和 Node.js，因此能够利用相同的技术和技能组合使我们的团队能够更快地行动、构建更多内容，并最终提供更好的体验。此外，由于能够在 macOS、Windows 和 Linux 版本的应用之间共享超过 95% 的代码，我们可以专注于构建出色的核心用户体验，而无需为每个平台维护一套代码库。

¥Ghost uses JavaScript and Node.js on both the backend and frontend, so being able to utilize the same technology and skillset enables our team to move faster, build more, and ultimately deliver a better experience. In addition, being able to share more than 95% of code between the macOS, Windows, and Linux version of the app allows us to focus on building a great core user experience, without having to maintain one code base for each platform.

在构建 Ghost Desktop 时，你遇到了哪些挑战？​

¥What are some challenges you've faced while building Ghost Desktop?

拼写检查可能仍然是最难实现的服务之一。 - 我们可以轻松使用众多在线服务，但要正确地对多种语言的文本进行拼写检查，同时保护用户的隐私和自主权并非易事。

¥Spellchecking is likely still one of the most difficult services offered - we could easily utilize one of the many online services, but correctly spellchecking text in multiple languages while guarding the privacy and autonomy of our users is not an easy task.

Electron 应该在哪些方面改进？​

¥In what areas should Electron be improved?

我们希望 Electron 能够将操作系统原生的拼写检查功能引入到他们的应用中。我们梦想着 <input> 字段能够获得与 NSTextView 字段相同的服务，但我们也深知这有多么困难。

¥We would love to see Electron bring the operating system's native spellchecking capabilities to their apps. We're dreaming about a world in which an <input> field receives the same services as a NSTextView, but we are also intimately aware how difficult that is.

你最喜欢 Electron 的哪些方面？​

¥What are your favorite things about Electron?

JavaScript 以其庞大的生态系统而闻名，涉及无数的工具和框架。 - 但它给我们带来的便利是无可厚非的。使用 Electron 构建应用仅比构建 Web 应用稍微难一点，这是一个了不起的成就。

¥JavaScript is famous for being a vast ecosystem, involving countless tools and frameworks - but the convenience it affords us is hard to overstate. Building an app with Electron is only slightly harder than building a web app, which is an amazing feat.

Ghost 完成了吗？如果不行，下一步是什么？​

¥Is Ghost done? If not, what's coming next?

Ghost Desktop 也是一个正在进行的项目 - 我们离完成还很远。我们一直在讨论为用户提供完全离线模式，现在距离这个目标已经很近了。其他值得注意的工作字段包括扩展和与其他文本编辑应用（如 Word 或 Atom）的集成，最终允许人们使用他们喜欢的工具撰写文章。总体而言，一旦我们发布了离线模式功能，我们就会寻求与操作系统更深入的集成。如果你对此感兴趣，加入我们！

¥Ghost Desktop is also an ongoing project - we're pretty far from being done. We have been talking for a while about bringing a full offline mode to our users, and we're getting fairly close. Other notable work areas are the extension and integration with other text editing apps (like Word or Atom), ultimately allowing people to write posts using their favorite tools. In general, once we've shipped the offline mode feature, we're looking for deeper integration with the operating system. If that sounds interesting to you, join us!

你最喜欢的 Electron 应用有哪些？​

¥What are some of your favorite Electron apps?

我是 Kap、Felony 和 Visual Studio Code 的忠实粉丝。

¥I'm a big fan of Kap, Felony, and Visual Studio Code.

👻

本周，我们采访了 烧杯浏览器 的创建者 Paul Frazee。Beaker 是一款实验性的点对点网络浏览器，它使用 Dat 协议在用户的设备上托管网站。

¥This week we caught up with Paul Frazee, creator of Beaker Browser. Beaker is an experimental peer-to-peer web browser that uses the Dat protocol to host sites from users’ devices.

什么是 Beaker？为什么创建它？​

¥What is Beaker and why did you create it?

Beaker 是一款参与式浏览器。这是一款面向独立开发者的浏览器。

¥Beaker is a participatory browser. It's a browser for indie hackers.

Web 是闭源的。如果你想影响社交媒体的运作方式，你就必须在 Facebook 或 Twitter 上工作。搜索请见 Google。控制权掌握在公司手中，而不是用户自己。

¥The Web is closed source. If you want to influence how social media works, you have to work at Facebook or Twitter. For search, Google. Control is in the hands of companies, rather than the users themselves.

有了 Beaker，我们有了一个新的 Web 协议：去中心化归档传输。"日期。" 可以按需免费创建网站，然后从设备共享。无需服务器。这就是我们的创新。

¥With Beaker, we have a new Web protocol: the Decentralized Archive Transport. "Dat." It creates sites on demand, for free, and then shares them from the device. No servers required. That's our innovation.

当你在 Beaker 中访问 Dat 站点时，你会下载这些文件。网站永远属于你。你可以免费保存、分叉、修改和分享你的新版本。完全开源。

¥When you visit a Dat site in Beaker, you download the files. The site is yours, forever. You can save it, fork it, modify it, and share your new version for free. It's all open-source.

这就是它的意义所在：我们正在为开源网站开发一款浏览器。我们希望它成为社交黑客的工具包。

¥So that's what it's about: We're making a browser for open-source Websites. We want it to be a toolkit for social hacking.

谁应该使用 Beaker？​

¥Who should be using Beaker?

黑客。Modders。创意类型。喜欢捣鼓的人。

¥Hackers. Modders. Creative types. People who like to tinker.

如何创建一个使用 Dat 的新项目？​

¥How do I create a new project that uses Dat?

我们已推出 一个名为 bkr 的命令行工具，它类似于 git + npm。网站创建成功：

¥We've got a command-line tool called bkr that's kind of like git + npm. Here's creating a site:

$ cd ~/my-site
$ bkr init
$ echo "Hello, world!" > index.html
$ bkr publish

这是一个 fork 站点的示例：

¥And here's forking a site:

$ bkr fork dat://0ff7d4c7644d0aa19914247dc5dbf502d6a02ea89a5145e7b178d57db00504cd/ ~/my-fork
$ cd ~/my-fork
$ echo "My fork has no regard for the previous index.html!" > index.html
$ bkr publish

这些网站将不再托管在你的浏览器中。它有点像 BitTorrent；你可以在 P2P 网格中共享网站。

¥Those sites then get hosted out of your browser. It's a little like BitTorrent; you share the sites in a P2P mesh.

如果你需要 GUI，我们在浏览器中内置了一些基本工具，但我们正在将这些工具推送到用户空间。所有这些都将是可修改的用户应用。

¥If you want a GUI, we have some basic tools built into the browser, but we're pushing those tools into userland. It's all going to be moddable user apps.

为什么选择在 Electron 上构建 Beaker？​

¥Why did you choose to build Beaker on Electron?

对于这个项目来说，这一点显而易见。如果我自己 fork Chrome，我现在就会写 C++ 了！没人愿意这样做。我了解 Web 技术栈，并且可以快速上手。这很简单。

¥It was obvious for this project. If I forked Chrome myself, I'd be writing C++ right now! Nobody wants to do that. I know the Web stack, and I can work quickly with it. It's a no-brainer.

事实上，如果没有 Electron，我不确定我能做到这些。这是一款很棒的软件。

¥The truth is, I'm not sure I could do any of this without Electron. It's a great piece of software.

你在构建 Beaker 时遇到了哪些挑战？​

¥What are some challenges you've faced while building Beaker?

一半的时间都在研究工具，并弄清楚我能做多少。

¥Half of it is poking at the tools and figuring out how much I can get away with.

浏览器本身的开发非常简单。Electron 实际上是一套用于开发浏览器的工具包。……除了浏览器标签页；我花了很长时间才搞定。我终于彻底搞定了，并学会了如何使用 SVG。它看起来好多了，但我花了三四次迭代才搞定。

¥Making the browser itself was pretty easy. Electron is practically a toolkit for making browsers. ...Except for the browser tabs; that took me forever to get right. I finally broke down and learned how to do SVGs. It's much better looking, but it took 3 or 4 iterations before I got that right.

Electron 应该在哪些方面改进？​

¥In what areas should Electron be improved?

如果我能将开发者工具停靠在 Web 视图中就太好了。

¥It'd be really great if I could dock the devtools inside a webview.

Beaker 的下一步计划是什么？​

¥What's coming next in Beaker?

Dat 网站的安全 DNS 名称。一种可社交配置的 URL 方案，称为 "应用方案。" More Dat API。

¥Secure DNS names for Dat sites. A socially configurable URL scheme, called the "app scheme." More Dat APIs.

对于可能有兴趣为项目做出贡献的人，Beaker 在哪些方面需要帮助？​

¥For folks who may be interested in contributing to the project, in what areas does Beaker need help?

我们有很多未解决的问题。别害怕联系我。freenode 上的 #beakerbrowser。我们保留一个 贡献者页面 项目，并将你添加到其中。如果你访问奥斯汀，我会请你喝啤酒。

¥We have lots of open issues. Don't be afraid to ping me. #beakerbrowser on freenode. We keep a page for contributors and we'll add you to it. And if you visit Austin, I'll buy you a beer.

有哪些 Electron 开发技巧可能对其他开发者有用？​

¥Any Electron tips that might be useful to other developers?

1. 使用现有的构建工具。相信我，你肯定不想费力地自己琢磨解决方案。使用 electron-builder。使用样板代码库。

   ¥Use the build tooling that's out there. You don't want to wrestle with your own solutions, trust me. Use electron-builder. Use a boilerplate repo.

2. 如果你需要在 Electron 代码库中提交问题，请多加留意，以便轻松复现。你将更快地收到回复，团队将对此表示感谢。更好的是，尝试自行修复。看到它的内部结构其实很有趣。

   ¥If you need to open an issue in the Electron repo, go the extra mile to make it easy to reproduce. You'll get a response much more quickly, and the team will appreciate it. Even better, try fixing it yourself. It's actually pretty interesting to see the innards.

3. 请至少通读一遍所有指南和高级文档。

   ¥Read through all the guides and advanced docs at least once.

4. 不要构建浏览器，这是一个饱和的市场。

   ¥Don't build a browser, it's a saturated market.

Electron 社区正在快速发展，人们正在以惊人的速度创建强大的新应用和工具。为了庆祝这一创新势头，并让社区了解一些新项目，我们决定开设一个每周博客系列，介绍值得关注的 Electron 相关项目。

¥The Electron community is growing quickly, and people are creating powerful new apps and tools at an astounding rate. To celebrate this creative momentum and keep the community informed of some of these new projects, we've decided to start a weekly blog series featuring noteworthy Electron-related projects.

本文是本系列的第一篇，主要介绍 Kap，这是一款由地理分布的自由设计师和开发者团队 Wulkano 开发的开源屏幕录制应用。

¥This post is the first in the series, and features Kap, an open-source screen recording app built by Wulkano, a geodistributed team of freelance designers and developers.

什么是 Kap？​

¥What is Kap?

Kap 是一款开源屏幕录像机 主要为设计师和开发者构建，方便他们轻松捕捉工作成果。人们使用它来分享动画原型、记录错误、创建有趣的 GIF 以及介于两者之间的一切。

¥Kap is an open-source screen recorder built primarily for designers and developers to easily capture their work. People use it to share animated prototypes, document bugs, create silly GIFs and everything in-between.

我们看到不同年龄段、不同背景的人们都在教育场合、截屏视频、教程等场合使用它。列表还在继续。甚至用于创建生产资源！我们的小项目如此受欢迎，让我们感到非常惊喜。

¥We've seen people of all ages and backgrounds use it in educational settings, screencasts, tutorials... the list goes on. Even to create production assets! We're completely blown away by how well received our little side project has been.

为什么要构建它？​

¥Why did you build it?

这个问题问得好，毕竟现在也不缺屏幕录像机！我们认为其他替代方案要么过于复杂、成本过高，要么功能过于有限。没有什么感觉恰到好处，可以满足我们的日常需求。我们也认为，我们工作中使用的工具开源是一件很棒的事情，这样每个人都可以帮助改进它们。构建 Kap 最终与我们没有做的事情一样重要。一切都在于细节，一些小改进的积累，最终形成了我们想要使用的工具的轮廓。

¥That's a very good question, it's not like there's a lack of screen recorders out there! We felt the alternatives were either too complex, too expensive or too limited. Nothing felt just right for our everyday needs. We also think it's great when the tools we use to do our work are open-source, that way everyone can help shape them. Building Kap ended up being just as much about what we didn't do. It's all in the details, an accumulation of small improvements that became the outline of a tool we wanted to use.

然而，或许最重要的是，Kap 已经成为一个让我们抛开一切烦恼，尽情享受为自己和像我们一样的人构建东西的乐趣的地方。创造一个可以尽情发泄、尝试新事物并享受创作乐趣的环境至关重要。无要求，无压力，无期望。设计师和开发者应该进行侧项目吗？当然。是的，应该这样做。

¥However, and maybe most importantly, Kap has become a place for us to leave our worries at the door and just have fun building something for ourselves and people like us. It's so important to create an environment where you get to just vent, try new thins and enjoy your craft. No requirements, no pressure, no expectations. Should designers and developers side project? Why, yes. Yes, they should.

为什么选择在 Electron 上构建 Kap？​

¥Why did you choose to build Kap on Electron?

原因如下：

¥There were a number of reasons:

• Web 技术

  ¥Web tech

• 团队大部分成员都是 Web 开发者

  ¥Most of the team are web developers

• 我们投资于 JavaScript

  ¥We're invested in JavaScript

• 它为更多人贡献代码打开了大门

  ¥It opens the door for more people to contribute

• Electron 本身是开源的

  ¥Electron itself is open-source

• node_modules 的强大功能和易于维护的模块化

  ¥The power and easily maintainable modularity of node_modules

• 跨平台可能性

  ¥Cross-platform possibilities

我们认为应用的未来在于浏览器，但我们还没有完全实现这一目标。Electron 是迈向未来的重要一步。它不仅使应用本身更易于访问，也使构建它们的代码更易于访问。一个有趣的想法是设想未来操作系统就是浏览器，而标签页本质上就是 Electron 应用。

¥We think the future of apps are in the browser, but we're not quite there yet. Electron is an important step in the journey towards that future. It not only makes the apps themselves more accessible, but also the code they're built with. An interesting thought is imagining a future where the OS is a browser, and the tabs are essentially Electron apps.

此外，作为 Web 开发者，我们非常欣赏 JavaScript 的同构特性，因为 JS 可以在客户端、服务器以及现在的桌面上运行。使用 Web 技术（HTML、CSS 和 JS），很多事情比原生技术简单得多：更快的原型设计，更少的代码，弹性框 > 自动布局（macOS/iOS）。

¥Additionally, being primarily web developers, we're big fans of the isomorphic nature of JavaScript, in that you can run JS on the client, server, and now the desktop. With web tech (HTML, CSS and JS), many things are much simpler than native: Faster prototyping, less code, flexbox > auto-layout (macOS/iOS).

在构建 Kap 时，你遇到了哪些挑战？​

¥What are some challenges you've faced while building Kap?

利用 Electron 可用的资源来录制屏幕是最大的挑战。它们的性能不足以满足我们的要求，在我们看来，这会使项目失败。虽然 Electron 本身没有问题，但在原生开发和使用 Web 技术构建桌面应用之间仍然存在差距。

¥Using the resources Electron has available to record the screen was the biggest challenge. They simply weren't performant enough to meet our requirements and would render the project a failure in our eyes. Though at no fault of Electron itself, there's still a gap between native development and building desktop apps with web tech.

我们花了大量时间尝试解决 getUserMedia API 性能不佳的问题，这个问题源于 Chromium。我们着手开发 Kap 时的主要目标之一是使用 Web 技术构建整个应用。在尝试了所有方法使其正常运行之后（最低要求是在 Retina 屏幕上达到 30 FPS），我们最终不得不寻找其他解决方案。

¥We spent a lot of time trying to work around the poor performance of the getUserMedia API, an issue originating in Chromium. One of our main goals when we set out to make Kap was to build the entire app with web tech. After trying everything we could to get it working (the minimum requirement being 30 FPS on a Retina screen), we eventually had to find another solution.

我在代码库中看到了一些 Swift 代码。关于什么？​

¥I see some Swift code in the repo. What's that about?

被迫寻找 getUserMedia 的替代方案，我们开始尝试 ffmpeg。除了是最好的音频和视频转换工具之一之外，它还具有在几乎所有操作系统中录制屏幕的功能，并且我们能够在 Retina 屏幕上录制出清晰的视频，满足我们最低 30 FPS 的要求。有问题吗？性能方面，"😩" 的 CPU 占用率一度飙升。因此，我们重新开始，讨论了各种方案，并意识到必须做出妥协。这促成了 Aperture 的诞生，这是我们用 Swift 编写的 macOS 屏幕录制库。

¥Being forced to look for alternatives to getUserMedia, we started experimenting with ffmpeg. Besides being one of the best tools for audio and video conversion it has the functionality of recording the screen in almost any OS, and we were able to record crispy video meeting our minimum requirement of 30 FPS on a Retina screen. Problem? The performance was "😩", the CPU usage was going haywire. So we went back to the drawing board, discussed our options and realised that we had to make a compromise. That resulted in Aperture, our own screen recording library for macOS written in Swift.

Electron 应该在哪些方面改进？​

¥In what areas should Electron be improved?

我们都知道 Electron 应用可能会占用大量内存，但这其实是 Chromium 的问题。这是它工作方式的一部分，实际上取决于你运行的是什么，例如 Kap 和 Hyper 通常占用不到 100MB 的内存。

¥We all know that Electron apps can have a thing for using RAM, but again, that's really a Chromium thing. It's part of how it works and it really depends on what you're running, for example Kap and Hyper typically use less than 100MB of memory.

我们看到的最大改进字段之一是负载，尤其是 Electron 分发 Chromium 的方式。一个想法是使用共享的 Electron 核心，并让应用安装程序检查它是否已存在于系统中。

¥One of the biggest areas of improvement that we see is payload, particularly how Electron distributes Chromium. One idea would be to have a shared Electron core and make app installers check if it's already present on the system.

创建跨平台 Electron 应用可能会提供更佳体验。目前，平台之间存在太多不一致、平台特定 API 以及功能缺失的问题，导致你的代码库充斥着 if-else 语句。例如，vibrancy 仅在 macOS 上受支持，自动更新程序在 macOS 和 Windows 上的运行方式不同，甚至在 Linux 上也不受支持。在 Linux 上，透明度有时好有时坏，通常都不好。

¥Creating cross-platform Electron apps could be a better experience. Right now there are too many inconsistencies, platform-specific APIs, and missing features between platforms, making your codebase littered with if-else statements. For example, vibrancy is only supported on macOS, the auto-updater works differently on macOS and Windows, and is not even supported on Linux. Transparency is a hit or miss on Linux, usually miss.

调用原生系统 API 也应该更容易。Electron 提供了一套非常优秀的 API，但有时你需要它未提供的功能。创建原生 Node.js 插件是一种选择，但使用起来很麻烦。理想情况下，Electron 应该附带一个良好的 FFI API，例如 fastcall。这样我们就可以用 JavaScript 编写 Swift 部分了。

¥It should also be easier to call native system APIs. Electron comes with a very good set of APIs, but sometimes you need functionality it doesn't provide. Creating a native Node.js addon is an option, but it's painful to work with. Ideally Electron would ship with a good FFI API, like fastcall. This would have enabled us to write the Swift part in JavaScript instead.

你最喜欢 Electron 的哪些方面？​

¥What are your favorite things about Electron?

我们最喜欢的一点是，任何具备 Web 创作知识的人都可以构建并为多平台原生体验做出贡献。更不用说在其上进行开发的轻松和乐趣、优秀的文档和蓬勃发展的生态系统。

¥Our favorite thing is easily the fact that anyone with knowledge of creating for the web can build and contribute to multi-platform native experiences. Not to mention the ease and joy of developing on it, the excellent documentation and the thriving ecosystem.

从前端的角度来看，构建 Kap 与使用浏览器 API 构建一个简单的网站没有什么不同。Electron 在使应用开发与 Web 开发相似（基本相同）方面做得非常出色。实际上非常简单，我们不需要框架或类似的东西来帮助我们，只需要简洁且模块化的 JS 和 CSS。

¥From a front-end perspective, building Kap felt no different than building a simple website using browser APIs. Electron does a really great job of making app development similar (basically identical) to web development. So simple in fact that there was no need for frameworks or similar to help us, just clean and modular JS and CSS.

我们也非常欣赏这个项目的开发团队、他们的奉献精神和支持，以及他们维护的活跃友好的社区。拥抱你们所有人！

¥We are also huge fans of the team building it, their dedication and support, and the active and friendly community they maintain. Hugs to all of you!

Kap 的下一步计划是什么？​

¥What's coming next in Kap?

我们的下一步是审查该应用，为 2.0.0 里程碑版本做准备，该版本除了支持插件外，还包含 React 重写，允许开发者扩展 Kap 的功能！我们诚邀大家关注我们的 GitHub 代码库 项目并为其做出贡献。让我们知道如何让 Kap 成为最适合你的工具，我们倾听并希望听到尽可能多的你们的声音！

¥The next step for us is to review the app in preparation for our 2.0.0 milestone, which includes a React re-write in addition to support for plugins, allowing developers to extend the functionality of Kap! We invite everyone to follow to project and contribute on our GitHub repository. We're listening and want to hear from as many of you as possible, let us know how we can make Kap the best possible tool it can be for you!

什么是 Wulkano？​

¥What is Wulkano?

Wulkano 是一个设计工作室和数字集体，由一群热爱远程工作的技术人员组成，他们既喜欢为客户工作，也喜欢在自己的项目上合作。我们是一个分散但紧密联系的群体，来自不同地方，拥有不同的背景。在我们的虚拟办公室（恰好是基于 Electron 的 Slack！），我们分享知识、想法、经验，但最重要的是分享一些搞笑的 GIF 和表情包。

¥Wulkano is a design studio and digital collective, a team of remote technologists who love working together on both client gigs and our own projects. We're a distributed but tight knit group of people from different places and backgrounds, sharing knowledge, ideas, experiences, but most importantly silly GIFs and memes, in our virtual office (which happens to be the Electron based Slack!).

有哪些 Electron 开发技巧可能对其他开发者有用？​

¥Any Electron tips that might be useful to other developers?

充分利用并参与精彩的 community，了解 令人敬畏的 Electron，了解 示例，并充分利用强大的 docs！

¥Take advantage of and get involved in the fantastic community, check out Awesome Electron, look at examples and make use of the great docs!

我们最近在 GitHub 总部为 Hackbright 学院（一家位于旧金山的女性编程学校）的成员举办了一场 Electron 黑客马拉松。为了帮助参会者快速上手项目，我们自己的 Kevin Sawicki 创建了一些 Electron 示例应用。

¥We recently hosted an Electron hackathon at GitHub HQ for members of Hackbright Academy, a coding school for women founded in San Francisco. To help attendees get a head start on their projects, our own Kevin Sawicki created a few sample Electron applications.

如果你是 Electron 开发新手或尚未尝试过，这些示例应用是一个很好的起点。它们代码简洁、易于阅读，并且代码包含大量注释以解释其工作原理。

¥If you're new to Electron development or haven't yet tried it out, these sample applications are a great place to start. They are small, easy to read, and the code is heavily commented to explain how everything works.

首先，请克隆此代码库：

¥To get started, clone this repository:

git clone https://github.com/electron/simple-samples

要运行以下任何应用，请切换到应用目录，安装依赖，然后启动：

¥To run any of the apps below, change into the app's directory, install dependencies, then start:

cd activity-monitor
npm install
npm start

活动监视器​

¥Activity Monitor

显示 CPU 系统、用户和空闲活动时间的环形图。

¥Shows a doughnut chart of the CPU system, user, and idle activity time.

哈希​

¥Hash

显示使用不同算法计算的输入文本的哈希值。

¥Shows the hash values of entered text using different algorithms.

镜像​

¥Mirror

以最大化尺寸播放电脑摄像头拍摄的视频，就像照镜子一样。包含一个可选的彩虹滤镜效果，该效果使用了 CSS 动画。

¥Plays a video of the computer's camera at a maximized size like looking into a mirror. Includes an optional rainbow filter effect that uses CSS animations.

价格​

¥Prices

使用 Yahoo 财经 API 显示石油、黄金和白银的当前价格。

¥Shows the current price of oil, gold, and silver using the Yahoo Finance API.

URL​

在窗口中加载通过命令行传递的 URL。

¥Loads a URL passed on the command line in a window.

其他资源​

¥Other Resources

我们希望这些应用能帮助你快速上手 Electron。以下是一些其他资源，可供你了解更多信息：

¥We hope these apps help you get started using Electron. Here are a handful other resources for learning more:

• electron-quick-start：极简 Electron 应用样板。

  ¥electron-quick-start: A minimal Electron application boilerplate.

• Electron API 演示：一个演示 Electron API 核心功能的交互式应用

  ¥Electron API Demos: An interactive app that demonstrates the core features of the Electron API

• electronjs.org/docs/all：所有 Electron 文档均集中到一个可搜索的页面上。

  ¥electronjs.org/docs/all: All of the Electron documentation together on a single searchable page.

• hokein/electron-sample-apps：由 Electron 维护者 Haojian Wu 编译的另一个 Electron 示例应用集合。

  ¥hokein/electron-sample-apps: Another collection of sample applications for Electron, compiled by Electron maintainer Haojian Wu.

• awesome-electron - GitHub 代码库，收集最新、最棒的 Electron 相关教程、书籍、视频等。

  ¥awesome-electron - A GitHub repository that collects the latest and greatest Electron-related tutorials, books, videos, etc.

我们在 Electron 网站上添加了一个新的 userland 部分，以帮助用户发现构成我们蓬勃发展的开源生态系统的人员、软件包和应用。

¥We've added a new userland section to the Electron website to help users discover the people, packages, and apps that make up our flourishing open-source ecosystem.

用户空间的起源​

¥Origins of Userland

Userland 是软件社区成员聚集在一起分享工具和创意的地方。该术语起源于 Unix 社区，当时它指的是任何在内核之外运行的程​​序，但如今它的含义更多。当今 JavaScript 社区的人们提到用户空间时，通常指的是 npm 包注册中心。大多数实验和创新都发生在这里，而 Node 和 JavaScript 语言（类似 Unix 内核）则保留了一组相对较小且稳定的核心功能。

¥Userland is where people in software communities come together to share tools and ideas. The term originated in the Unix community, where it referred to any program that ran outside of the kernel, but today it means something more. When people in today's Javascript community refer to userland, they're usually talking about the npm package registry. This is where the majority of experimentation and innovation happens, while Node and the JavaScript language (like the Unix kernel) retain a relatively small and stable set of core features.

Node 和 Electron​

¥Node and Electron

与 Node 一样，Electron 也拥有少量核心 API。它们提供了开发多平台桌面应用所需的基本功能。这种设计理念使得 Electron 仍然是一个灵活的工具，而不会过度规范它的使用方式。

¥Like Node, Electron has a small set of core APIs. These provide the basic features needed for developing multi-platform desktop applications. This design philosophy allows Electron to remain a flexible tool without being overly prescriptive about how it should be used.

Userland 与 "core" 相对应，使用户能够创建和共享用于扩展 Electron 功能的工具。

¥Userland is the counterpart to "core", enabling users to create and share tools that extend Electron's functionality.

数据收集​

¥Collecting data

为了更好地了解生态系统的趋势，我们分析了 15,000 个依赖 electron 或 electron-prebuilt 的公共 GitHub 仓库的元数据。

¥To better understand the trends in our ecosystem, we analyzed metadata from 15,000 public GitHub repositories that depend on electron or electron-prebuilt

我们使用 GitHub API、libraries.io API 和 npm 注册表来收集有关依赖、开发依赖、依赖、软件包作者、代码库贡献者、下载次数、fork 次数、stargazer 次数等信息。

¥We used the GitHub API, the libraries.io API, and the npm registry to gather info about dependencies, development dependencies, dependents, package authors, repo contributors, download counts, fork counts, stargazer counts, etc.

然后，我们使用这些数据生成了以下报告：

¥We then used this data to generate the following reports:

• 应用开发依赖：在 Electron 应用中最常列为 devDependencies 的软件包。

  ¥App Development Dependencies: Packages most often listed as devDependencies in Electron apps.

• GitHub 贡献者：GitHub 用户为众多 Electron 相关的 GitHub 代码库做出了贡献。

  ¥GitHub Contributors: GitHub users who have contributed to numerous Electron-related GitHub repositories.

• 软件包依赖：与 Electron 相关的、经常被其他 npm 软件包依赖的 npm 软件包。

  ¥Package Dependencies: Electron-related npm packages that are frequently depended on by other npm packages.

• 已加星标的应用：拥有众多 Stargazer 的 Electron 应用（非 npm 软件包）。

  ¥Starred Apps: Electron apps (that are not npm packages) with numerous stargazers.

• 下载次数最多的软件包：与 Electron 相关的、下载量很大的 npm 软件包。

  ¥Most Downloaded Packages: Electron-related npm packages that are downloaded a lot.

• 应用依赖：在 Electron 应用中最常列为 dependencies 的软件包。

  ¥App Dependencies: Packages most often listed as dependencies in Electron apps.

• 软件包作者：Electron 相关 npm 软件包的最多产作者。

  ¥Package Authors: The most prolific authors of Electron-related npm packages.

过滤结果​

¥Filtering Results

列出软件包、应用和代码库的报告（例如 应用依赖 和 已加星标的应用）具有可用于筛选结果的文本输入框。

¥Reports like app dependencies and starred apps which list packages, apps, and repos have a text input that can be used to filter the results.

当你在此输入框中输入内容时，页面的 URL 会动态更新。这允许你复制代表特定用户空间数据片段的 URL，然后与他人共享。

¥As you type into this input, the URL of the page is updated dynamically. This allows you to copy a URL representing a particular slice of userland data, then share it with others.

更多内容即将推出​

¥More to come

第一组报告仅仅是个开始。我们将继续收集社区构建 Electron 的数据，并将新的报告添加到网站。

¥This first set of reports is just the beginning. We will continue to collect data about how the community is building Electron, and will be adding new reports to the website.

用于收集和显示这些数据的所有工具均为开源：

¥All of the tools used to collect and display this data are open-source:

• electron/electronjs.org：Electron 网站。

  ¥electron/electronjs.org: The Electron website.

• electron/electron-userland-reports：Electron 用户空间中有关软件包、代码库和用户的数据切片。

  ¥electron/electron-userland-reports: Slices of data about packages, repos, and users in Electron userland.

• electron/repos-using-electron：GitHub 上所有依赖 electron 或 electron-prebuilt 的公共仓库

  ¥electron/repos-using-electron: All public repositories on GitHub that depend on electron or electron-prebuilt

• electron/electron-npm-packages：所有在其 package.json 文件中提及 electron 的 npm 软件包。

  ¥electron/electron-npm-packages: All npm packages that mention electron in their package.json file.

如果你对如何改进这些报告有任何想法，请通过 在网站代码库中提交问题 或上述任何代码库告知我们。

¥If you have ideas about how to improve these reports, please let us know opening an issue on the website repository or any of the above-mentioned repos.

感谢 Electron 社区，是你们成就了今天的用户空间！

¥Thanks to you, the Electron community, for making userland what it is today!