本周的特色项目是 Dat，一个由资助支持的、开源、去中心化的数据集分发工具。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

这将创建一个链接，你可以用它将该文件夹发送给其他人——没有中央服务器或第三方可以访问你的数据。与 BitTorrent 不同，你也无法窥探谁在分享什么（更多细节请参阅 Dat 论文草稿）。

🌐 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 Desktop 是一种让无法或不想使用命令行的人也能使用 Dat 的方式。你可以在你的电脑上托管多个 dat，并通过网络提供数据。

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

🌐 Can you share some cool use cases?

DataRefuge + Svalbard 项目​

🌐 DataRefuge + Project Svalbard

我们正在开发一个代号为 Project Svalbard 的项目，它与 DataRefuge 有关，这是一个致力于备份可能消失的政府气候数据的组织。Svalbard 以北极的斯瓦尔巴全球种子库命名，该库拥有大型的地下植物 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 的每日下载服务，CAL-ACCESS 是加州追踪政治资金的数据库。他们提供 每日更新，这意味着他们的压缩文件中会包含大量重复数据。我们正在将他们的数据托管为 Dat 仓库，这将减少查找特定版本或更新到新版本所需的麻烦和带宽。

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?

任何想在点对点网络上共享和更新数据的人。数据科学家、开放数据爱好者、研究人员、开发者。如果有人有我们还没想到的有趣用例，我们非常欢迎反馈。你可以加入我们的 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 注册表网页应用，将部署在 datproject.org，它基本上会是一个“数据集的 NPM”，唯一的区别是我们只是一个元数据目录，数据本身可以存放在任何网上位置（不像 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:

• 遥测 - 如何捕获匿名使用统计数据
• 更新 - 设置自动更新有点零散且需要一些技巧
• 发布——XCode 签名、在 Travis 上构建发布版本、进行 Beta 构建，这些都是挑战。

我们还在 Dat Desktop 的“前端”代码中使用了 Browserify 和一些很酷的 Browserify 转换器（这有点奇怪，因为即使我们有原生的 require，我们仍然进行打包——但这是因为我们需要这些转换器）。为了更好地管理我们的 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 压缩包中。这意味着压缩包会变大（虽然可以通过 .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?

在推特上关注 @dat_project，或订阅我们的 电子邮件通讯。

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

本周，我们与 Slack 的桌面工程师 Felix Rieseberg 进行了交流，他也是 Ghost Desktop 的维护者，Ghost Desktop 是 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 到天空新闻的博客、杂志和报告器提供支持。

🌐 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 是一个独立的非营利组织。我们为现代新闻和博客建设发布工具，因为我们相信言论自由很重要。我们的软件是在 自由开源许可证 下发布的，我们的商业模式是 完全透明的，我们的法律结构意味着我们赚取的 100% 资金都会再投资于提升 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 允许作家同时管理多个博客，并专注于写作。一些简单的功能，比如常用的写作快捷键，在浏览器中无法实现，但在我们的桌面应用中可以使用。它还允许其他应用通过深度链接直接与博客进行通信 via deeplinks。

🌐 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 for Journalism。

🌐 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 构建一个应用仅比构建一个网页应用_稍微_困难一些，这本身就是一项了不起的成就。

🌐 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.

《幽灵》完成了吗？如果没有，接下来会是什么？​

🌐 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 浏览器 的创作者。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.

网络是封闭源代码的。如果你想影响社交媒体的运作方式，你必须在 Facebook 或 Twitter 工作。对于搜索，则是谷歌。控制权掌握在公司手中，而不是用户自己。

🌐 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，我们有了一种新的网络协议：去中心化档案传输。“Dat”。它可以按需创建网站，免费提供，然后从设备上分享。无需服务器。这就是我们的创新。

🌐 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?

黑客。修改者。有创造力的人。喜欢摆弄东西的人。

🌐 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.

如果你想要一个图形界面，我们在浏览器中内置了一些基本工具，但我们正在把这些工具推向用户层。这些都将成为可修改的用户应用。

🌐 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?

对于这个项目来说，这很明显。如果我自己分叉 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 方案，称为“应用方案。” 更多 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。使用模板仓库。
2. 如果你需要在 Electron 仓库中提交一个问题，请尽量提供方便重现的问题步骤。这样你会更快得到回复，团队也会感激。更好的是，尝试自己修复它。看看其内部实现其实相当有趣。
3. 请至少通读一遍所有指南和高级文档。
4. 不要构建浏览器，这是一个饱和的市场。

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 构建的开源屏幕录制应用，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，以及其他各种用途。

我们看到各个年龄段和各种背景的人在教育环境中、屏幕录制、教程中使用它……列表还在继续。甚至用它来创建生产素材！我们对这个小型副项目受到的热烈欢迎感到完全震惊。

🌐 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 开发者
• 我们投资于 JavaScript
• 它为更多人贡献代码打开了大门
• Electron 本身是开源的
• node_modules 的强大功能和易于维护的模块化
• 跨平台可能性

我们认为应用的未来在于浏览器，但我们还没有完全到达那里。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.

此外，作为主要的网页开发者，我们非常喜欢 JavaScript 的同构特性，因为你可以在客户端、服务器端，现在甚至桌面端运行 JS。使用网页技术（HTML、CSS 和 JS），许多事情比原生开发简单得多：原型制作更快，代码更少，Flexbox 优于自动布局（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 时，我们的主要目标之一就是用网页技术构建整个应用。在尝试了一切可行的方法以使其工作（最低要求是在 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。除了是音频和视频转换方面最好的工具之一外，它几乎可以在任何操作系统上录制屏幕，并且我们成功录制出了符合最低要求 30 FPS 的清晰视频，在 Retina 屏幕上效果很好。问题？性能令人 😩，CPU 使用率异常高。所以我们回到起点，讨论我们的选项，并意识到我们必须做出妥协。结果就是 Aperture，我们为 macOS 编写的 Swift 屏幕录制库。

🌐 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 语句。例如，振动效果仅在 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?

我们最喜欢的一点无疑是，任何懂得网页开发的人都可以构建并贡献多平台的原生体验。更不用说在它上面开发的轻松与乐趣、出色的文档以及蓬勃发展的生态系统。

🌐 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 在让应用开发类似（基本上与）网页开发方面做得非常好。事实上非常简单，以至于根本不需要框架或类似工具来帮助我们，只需干净且模块化的 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 和表情包。

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

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

利用并参与精彩的社区，查看Awesome Electron，看看示例，并充分使用优秀的文档！

🌐 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 Academy 的成员举办了一场 Electron 黑客马拉松，Hackbright Academy 是一家创立于旧金山的女性编程学校。为了帮助参与者提前启动他们的项目，我们的 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 API 演示：一个互动应用，展示了 Electron API 的核心功能
• electronjs.org/docs/all：所有 Electron 文档汇集在一个可搜索的页面上。
• hokein/electron-sample-apps：另一个由 Electron 维护者 吴昊坚 编写的 Electron 示例应用集合。
• awesome-electron - 一个收集最新和最棒的 Electron 相关教程、书籍、视频等的 GitHub 仓库。

我们在 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 社区中的人们提到 userland 时，他们通常指的是 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。这些 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

为了更好地了解我们生态系统中的趋势，我们分析了依赖 electron 或 electron-prebuilt 的 15,000 个公共 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 注册表来收集关于依赖、开发依赖、依赖目、包作者、仓库贡献者、下载次数、派生次数、收藏次数等信息。

🌐 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 的包。
• GitHub 贡献者：在众多与 Electron 相关的 GitHub 仓库中做出贡献的 GitHub 用户。
• 软件包依赖：Electron 相关的 npm 软件包，其他 npm 软件包经常依赖它们。
• 加星应用：拥有众多收藏者的 Electron 应用（非 npm 包）。
• 最受欢迎的下载包：与 Electron 相关的 npm 包，下载量很高。
• 应用依赖：在 Electron 应用中最常被列为 dependencies 的软件包。
• 软件包作者：与 Electron 相关的 npm 包中最高产的作者。

过滤结果​

🌐 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/electron-userland-reports：关于 Electron 用户字段中包、仓库和用户的数据片段。
• electron/repos-using-electron：GitHub 上所有依赖 electron 或 electron-prebuilt 的公共仓库
• electron/electron-npm-packages：所有在其 package.json 文件中提到 electron 的 npm 包。

如果你有关于如何改进这些报告的想法，请告知我们
在网站仓库中提交问题
或上述提到的任何仓库。

🌐 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!

Electron 1.4.12 包含一个重要补丁，修复了上游 Chrome 的一个问题，该问题会导致一些 Symantec、GeoTrust 和 Thawte SSL/TLS 证书在 libchromiumcontent（Electron 底层的 Chrome 库）构建后 10 周被错误地拒绝。受影响网站使用的证书本身没有问题，更换这些证书也无济于事。

🌐 Electron 1.4.12 contains an important patch that fixes an upstream Chrome issue where some Symantec, GeoTrust, and Thawte SSL/TLS certificates are incorrectly rejected 10 weeks from the build time of libchromiumcontent, Electron's underlying Chrome library. There are no issues with the certificates used on the affected sites and replacing these certificates will not help.

在 Electron 1.4.0 至 1.4.11 版本中，使用这些受影响证书的网站的 HTTPS 请求在某个日期之后将因网络错误而失败。这会影响使用 Chrome 底层网络 API 发起的 HTTPS 请求，例如 window.fetch、Ajax 请求、Electron 的 net API、BrowserWindow.loadURL、webContents.loadURL、<webview> 标签上的 src 属性以及其他情况。

🌐 In Electron 1.4.0 — 1.4.11 HTTPS requests to sites using these affected certificates will fail with network errors after a certain date. This affects HTTPS requests made using Chrome's underlying networking APIs such as window.fetch, Ajax requests, Electron's net API, BrowserWindow.loadURL, webContents.loadURL, the src attribute on a <webview> tag, and others.

将你的应用升级到1.4.12将防止这些请求失败的发生。

🌐 Upgrading your applications to 1.4.12 will prevent these request failures from occurring.

注意： 这个问题是在 Chrome 53 中引入的，因此早于 1.4.0 的 Electron 版本不受影响。

影响日期​

🌐 Impact Dates

下面是一张表，列出了每个 Electron 1.4 版本以及使用受影响证书的网站请求开始失败的日期。

🌐 Below is a table of each Electron 1.4 version and the date when requests to sites using these affected certificates will start to fail.

你可以通过将电脑的时钟调快来验证你的应用的生效日期，然后检查 https://symbeta.symantec.com/welcome/ 是否能够成功加载。

🌐 You can verify your app's impact date by setting your computer's clock ahead and then check to see if https://symbeta.symantec.com/welcome/ successfully loads from it.

更多信息​

🌐 More Information

你可以在以下地方阅读有关此主题、原始问题及其解决方法的更多信息：

🌐 You can read more about this topic, the original issue, and the fix at the following places:

• 什么是证书透明度？
• Symtantec 知识库文章
• Chrome 问题 664177
• 针对问题 664177 的 Chrome 修复
• 针对问题 664177 的 libchromiumcontent 补丁

以下是 9 月份添加到网站的全新 Electron 应用和讲座。

🌐 Here are the new Electron apps and talks that were added to the site in September.

该网站通过社区的拉取请求更新新的应用和聚会。你可以关注仓库以接收新内容的通知，或者如果你对网站的所有更改不感兴趣，可以订阅博客 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 Talks

九月份，GitHub 举办了其 GitHub Universe 大会，被宣传为为那些构建软件未来的人们准备的活动。会上有几场关于 Electron 的有趣演讲。

🌐 In September, GitHub held its GitHub Universe conference billed as the event for people building the future of software. There were a couple of interesting Electron talks at the event.

• 让 Electron 开发更简单、更愉快、更高效 作者：Machisté Quintana，Slack 软件工程师。
• 《Electron：使用网页语言开发桌面应用》（https://www.youtube.com/watch?v=FNHBfN8c32U），作者 Zeke Sikelianos，GitHub 的 Electron 开发者。

另外，如果你恰好在12月5日身处巴黎，Zeke 将在 dotJS 2016 上做一次关于 Electron 的演讲（链接 https://twitter.com/dotJS/status/783615732307333120）。

🌐 Also, if you happen to be in Paris on December 5, Zeke will be giving an Electron talk at dotJS 2016.

新应用​

🌐 New Apps

	Pexels	Search for completely free photos and copy them into your clipboard
	Timestamp	A better macOS menu bar clock with a customizable date/time display and a calendar
	Harmony	Music player compatible with Spotify, Soundcloud, Play Music and your local files
	uPhone	WebRTC Desktop Phone
	SealTalk	Instant-messaging App powered by RongCloud IM Cloud Service and IM SDK
	Infinity	An easy way to make presentation
	Cycligent Git Tool	Straightforward, graphic GUI for your Git projects
	Foco	Stay focused and boost productivity with Foco
	Strawberry	Win Diners for Life Know and serve them better with the all-in-one restaurant software suite.
	Mixmax	See every action on your emails in real-time Compose anywhere.
	Firebase Admin	A Firebase data management tool
	ANote	A Simple Friendly Markdown Note
	Temps	A simple but smart menubar weather app
	Amium	A work collaboration product that brings conversation to your files
	Soube	Simple music player
	(Un)colored	Next generation desktop rich content editor that saves documents with themes HTML & Markdown compatible. For Windows, OS X & Linux.
	quickcalc	Menubar Calculator
	Forestpin Analytics	Financial data analytics tool for businesses
	Ling	REST Client
	Shortexts	Shortcuts for texts you copy frequently, folders and emojis
	Front-End Box	Set of front-end-code generators

今天我们宣布对 Electron 文档进行一些改进。每个新版本现在都包含一个JSON 文件，详细描述了所有 Electron 的公共 API。我们创建此文件是为了让开发者能够以有趣的新方式使用 Electron 的 API 文档。

🌐 Today we're announcing some improvements to Electron's documentation. Every new release now includes a JSON file that describes all of Electron's public APIs in detail. We created this file to enable developers to use Electron's API documentation in interesting new ways.

架构概述​

🌐 Schema overview

每个 API 都是一个具有名称、描述、类型等属性的对象。像 BrowserWindow 和 Menu 这样的类还有额外的属性，用于描述它们的实例方法、实例属性、实例事件等。

🌐 Each API is an object with properties like name, description, type, etc. Classes such as BrowserWindow and Menu have additional properties describing their instance methods, instance properties, instance events, etc.

以下是描述 BrowserWindow 类的模式摘录：

🌐 Here's an excerpt from the schema that describes the BrowserWindow class:

{
  name: 'BrowserWindow',
  description: 'Create and control browser windows.',
  process: {
    main: true,
    renderer: false
  },
  type: 'Class',
  instanceName: 'win',
  slug: 'browser-window',
  websiteUrl: 'https://electron.nodejs.cn/docs/api/browser-window',
  repoUrl: 'https://github.com/electron/electron/blob/v1.4.0/docs/api/browser-window.md',
  staticMethods: [...],
  instanceMethods: [...],
  instanceProperties: [...],
  instanceEvents: [...]
}

下面是一个方法描述的示例，在本例中是 apis.BrowserWindow.instanceMethods.setMaximumSize 实例方法：

🌐 And here's an example of a method description, in this case the apis.BrowserWindow.instanceMethods.setMaximumSize instance method:

{
  name: 'setMaximumSize',
  signature: '(width, height)',
  description: 'Sets the maximum size of window to width and height.',
  parameters: [{
    name: 'width',
    type: 'Integer'
  }, {
    name: 'height',
    type: 'Integer'
  }]
}

使用新数据​

🌐 Using the new data

为了让开发者在项目中更方便地使用这些结构化数据，我们创建了 electron-docs-api，这是一个小型的 npm 包，每当有新的 Electron 版本发布时，它会自动发布。

🌐 To make it easy for developers to use this structured data in their projects, we've created electron-docs-api, a small npm package that is published automatically whenever there's a new Electron release.

npm install electron-api-docs --save

为了立即获得满足，请在你的 Node.js REPL 中试用该模块：

🌐 For instant gratification, try out the module in your Node.js REPL:

npm i -g trymodule && trymodule electron-api-docs=apis

数据如何收集​

🌐 How the data is collected

Electron 的 API 文档遵循 Electron 编码规范 和 Electron 风格指南，因此其内容可以通进程序进行解析。

🌐 Electron's API documentation adheres to Electron Coding Style and the Electron Styleguide, so its content can be programmatically parsed.

electron-docs-linter 是 electron/electron 仓库的新开发依赖。它是一个命令行工具，用于检查所有的 Markdown 文件并强制执行风格指南的规则。如果发现错误，会列出这些错误并暂停发布进程。如果 API 文档有效，则会创建 electron-json.api 文件，并作为 Electron 发布的一部分上传到 GitHub。

🌐 The electron-docs-linter is a new development dependency of the electron/electron repository. It is a command-line tool that lints all the markdown files and enforces the rules of the styleguide. If errors are found, they are listed and the release process is halted. If the API docs are valid, the electron-json.api file is created and uploaded to GitHub as part of the Electron release.

标准 Javascript 和标准 Markdown​

🌐 Standard Javascript and Standard Markdown

今年早些时候，Electron 的代码库已更新为对所有 JavaScript 使用 standard linter。Standard 的自述文件总结了选择这一做法的原因：

🌐 Earlier this year, Electron's codebase was updated to use the standard linter for all JavaScript. Standard's README sums up the reasoning behind this choice:

采用标准风格意味着将代码清晰度和社区约定的重要性置于个人风格之上。这可能并不适用于100%的项目和开发文化，但开源社区对新手来说可能是一个充满挑战的环境。建立明确、自动化的贡献者预期可以让项目更加健康。

我们最近还创建了 standard-markdown 来验证我们文档中的所有 JavaScript 代码片段是否有效，并且与代码库本身的风格一致。

🌐 We also recently created standard-markdown to verify that all the JavaScript code snippets in our documentation are valid and consistent with the style in the codebase itself.

这些工具一起帮助我们使用持续集成（CI）自动发现拉取请求中的错误。这减少了人工进行代码审查的负担，并使我们对文档的准确性更有信心。

🌐 Together these tools help us use continuous integration (CI) to automatically find errors in pull requests. This reduces the burden placed on humans doing code review, and gives us more confidence about the accuracy of our documentation.

社区成果​

🌐 A community effort

Electron 的文档在不断改进，这要感谢我们出色的开源社区。截至撰写本文时，已有近 300 人为文档做出了贡献。

🌐 Electron's documentation is constantly improving, and we have our awesome open-source community to thank for it. As of this writing, nearly 300 people have contributed to the docs.

我们很高兴看到人们会如何使用这些新的结构化数据。可能的用途包括：

🌐 We're excited to see what people do with this new structured data. Possible uses include:

• 对 https://electron.nodejs.cn/docs/ 的改进
• 一个用于在使用 TypeScript 的项目中简化 Electron 开发的 TypeScript 定义文件。
• 可离线搜索的工具文档，例如 Dash.app 和 devdocs.io

作为一种具有垃圾回收功能的语言，JavaScript 免去了用户手动管理资源的麻烦。但由于 Electron 托管了这个环境，它必须非常小心，避免内存和资源泄漏。

🌐 As a language with garbage collection, JavaScript frees users from managing resources manually. But because Electron hosts this environment, it has to be very careful avoiding both memory and resources leaks.

这篇文章介绍了弱引用的概念以及它们如何用于在 Electron 中管理资源。

🌐 This post introduces the concept of weak references and how they are used to manage resources in Electron.

弱引用​

🌐 Weak references

在 JavaScript 中，每当你将一个对象赋值给一个变量时，你实际上是添加了对该对象的引用。只要对象有引用存在，它就会一直保留在内存中。一旦对象的所有引用都消失，也就是说不再有变量存储该对象，JavaScript 引擎将在下一次垃圾回收时回收这部分内存。

🌐 In JavaScript, whenever you assign an object to a variable, you are adding a reference to the object. As long as there is a reference to the object, it will always be kept in memory. Once all references to the object are gone, i.e. there are no longer variables storing the object, the JavaScript engine will recoup the memory on next garbage collection.

弱引用是一种对对象的引用，它允许你获取该对象，但不会影响对象是否会被垃圾回收。当对象被垃圾回收时，你也会收到通知。这样就可以使用 JavaScript 来管理资源。

🌐 A weak reference is a reference to an object that allows you to get the object without effecting whether it will be garbage collected or not. You will also get notified when the object is garbage collected. It then becomes possible to manage resources with JavaScript.

以 Electron 中的 NativeImage 类为例，每次调用 nativeImage.create() API 时，都会返回一个 NativeImage 实例，并且它会将图片数据存储在 C++ 中。一旦你使用完成该实例，并且 JavaScript 引擎（V8）已对该对象进行了垃圾回收，C++ 代码会被调用以释放内存中的图片数据，因此用户无需手动管理这一进程。

🌐 Using the NativeImage class in Electron as an example, every time you call the nativeImage.create() API, a NativeImage instance is returned and it is storing the image data in C++. Once you are done with the instance and the JavaScript engine (V8) has garbage collected the object, code in C++ will be called to free the image data in memory, so there is no need for users manage this manually.

另一个例子是 窗口消失问题，它直观地展示了当所有指向窗口的引用消失时，窗口是如何被垃圾回收的。

🌐 Another example is the window disappearing problem, which visually shows how the window is garbage collected when all the references to it are gone.

在 Electron 中测试弱引用​

🌐 Testing weak references in Electron

在原生 JavaScript 中没有直接测试弱引用的方法，因为该语言没有分配弱引用的方式。JavaScript 中与弱引用相关的唯一 API 是 弱映射，但由于它只创建弱引用键，因此无法知道对象何时被垃圾回收。

🌐 There is no way to directly test weak references in raw JavaScript since the language doesn't have a way to assign weak references. The only API in JavaScript related to weak references is WeakMap, but since it only creates weak-reference keys, it is impossible to know when an object has been garbage collected.

在 v0.37.8 之前的 Electron 版本中，你可以使用内部 v8Util.setDestructor API 来测试弱引用，该 API 会向传入的对象添加一个弱引用，并在对象被垃圾回收时调用回调函数：

🌐 In versions of Electron prior to v0.37.8, you can use the internal v8Util.setDestructor API to test weak references, which adds a weak reference to the passed object and calls the callback when the object is garbage collected:

// Code below can only run on Electron < v0.37.8.
var v8Util = process.atomBinding('v8_util');

var object = {};
v8Util.setDestructor(object, function () {
  console.log('The object is garbage collected');
});

// Remove all references to the object.
object = undefined;
// Manually starts a GC.
gc();
// Console prints "The object is garbage collected".

请注意，你必须使用 --js-flags="--expose_gc" 命令启动 Electron，切换以暴露内部的 gc 函数。

🌐 Note that you have to start Electron with the --js-flags="--expose_gc" command switch to expose the internal gc function.

该 API 在后续版本中被移除，因为 V8 实际上不允许在析构函数中运行 JavaScript 代码，在后续版本中这样做会导致随机崩溃。

🌐 The API was removed in later versions because V8 actually does not allow running JavaScript code in the destructor and in later versions doing so would cause random crashes.

remote 模块中的弱引用​

🌐 Weak references in the remote module

除了使用 C++ 管理本地资源外，Electron 还需要使用弱引用来管理 JavaScript 资源。一个例子是 Electron 的 remote 模块，它是一个 远程进程调用（RPC）模块，允许从渲染进程使用主进程中的对象。

🌐 Apart from managing native resources with C++, Electron also needs weak references to manage JavaScript resources. An example is Electron's remote module, which is a Remote Procedure Call (RPC) module that allows using objects in the main process from renderer processes.

remote 模块的一个关键挑战是避免内存泄漏。当用户在渲染进程中获取远程对象时，remote 模块必须保证该对象在主进程中继续存在，直到渲染进程中的引用消失。此外，它还必须确保当渲染进程中不再有任何引用时，该对象可以被垃圾回收。

🌐 One key challenge with the remote module is to avoid memory leaks. When users acquire a remote object in the renderer process, the remote module must guarantee the object continues to live in the main process until the references in the renderer process are gone. Additionally, it also has to make sure the object can be garbage collected when there are no longer any reference to it in renderer processes.

例如，如果没有适当的实现，下面的代码会很快导致内存泄漏：

🌐 For example, without proper implementation, following code would cause memory leaks quickly:

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

for (let i = 0; i < 10000; ++i) {
  remote.nativeImage.createEmpty();
}

remote 模块中的资源管理很简单。每当请求一个对象时，会向主进程发送一条消息，Electron 会将该对象存储到一个映射中并为其分配一个 ID，然后将该 ID 发送回渲染进程。在渲染进程中，remote 模块会接收该 ID，并用一个代理对象将其封装起来，当代理对象被垃圾回收时，会向主进程发送消息以释放该对象。

🌐 The resource management in the remote module is simple. Whenever an object is requested, a message is sent to the main process and Electron will store the object in a map and assign an ID for it, then send the ID back to the renderer process. In the renderer process, the remote module will receive the ID and wrap it with a proxy object and when the proxy object is garbage collected, a message will be sent to the main process to free the object.

以 remote.require API 为例，一个简化的实现如下所示：

🌐 Using remote.require API as an example, a simplified implementation looks like this:

remote.require = function (name) {
  // Tell the main process to return the metadata of the module.
  const meta = ipcRenderer.sendSync('REQUIRE', name);
  // Create a proxy object.
  const object = metaToValue(meta);
  // Tell the main process to free the object when the proxy object is garbage
  // collected.
  v8Util.setDestructor(object, function () {
    ipcRenderer.send('FREE', meta.id);
  });
  return object;
};

在主进程中：

🌐 In the main process:

const map = {};
const id = 0;

ipcMain.on('REQUIRE', function (event, name) {
  const object = require(name);
  // Add a reference to the object.
  map[++id] = object;
  // Convert the object to metadata.
  event.returnValue = valueToMeta(id, object);
});

ipcMain.on('FREE', function (event, id) {
  delete map[id];
});

带有弱值的 Map​

🌐 Maps with weak values

在之前的简单实现中，remote 模块中的每次调用都会返回来自主进程的新远程对象，每个远程对象都代表对主进程中对象的引用。

🌐 With the previous simple implementation, every call in the remote module will return a new remote object from the main process, and each remote object represents a reference to the object in the main process.

设计本身没问题，但问题在于当多次调用接收同一个对象时，会创建多个代理对象，对于复杂对象，这会对内存使用和垃圾回收带来巨大的压力。

🌐 The design itself is fine, but the problem is when there are multiple calls to receive the same object, multiple proxy objects will be created and for complicated objects this can add huge pressure on memory usage and garbage collection.

例如，以下代码：

🌐 For example, the following code:

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

for (let i = 0; i < 10000; ++i) {
  remote.getCurrentWindow();
}

它首先使用大量内存来创建代理对象，然后占用 CPU（中央处理器）来回收这些对象并发送 IPC 消息。

🌐 It first uses a lot of memory creating proxy objects and then occupies the CPU (Central Processing Unit) for garbage collecting them and sending IPC messages.

一个明显的优化是缓存远程对象：当已经存在具有相同 ID 的远程对象时，会返回之前的远程对象，而不是创建一个新的对象。

🌐 An obvious optimization is to cache the remote objects: when there is already a remote object with the same ID, the previous remote object will be returned instead of creating a new one.

在 JavaScript 核心中，使用 API 这是不可能的。使用普通的 map 来缓存对象会阻止 V8 对这些对象进行垃圾回收，而 弱映射 类只能将对象作为弱键使用。

🌐 This is not possible with the API in JavaScript core. Using the normal map to cache objects will prevent V8 from garbage collecting the objects, while the WeakMap class can only use objects as weak keys.

为了解决这个问题，添加了一种值为弱引用的映射类型，这对于缓存具有 ID 的对象非常适合。现在 remote.require 看起来是这样的：

🌐 To solve this, a map type with values as weak references is added, which is perfect for caching objects with IDs. Now the remote.require looks like this:

const remoteObjectCache = v8Util.createIDWeakMap()

remote.require = function (name) {
  // Tell the main process to return the meta data of the module.
  ...
  if (remoteObjectCache.has(meta.id))
    return remoteObjectCache.get(meta.id)
  // Create a proxy object.
  ...
  remoteObjectCache.set(meta.id, object)
  return object
}

请注意，remoteObjectCache 将对象存储为弱引用，因此在对象被垃圾回收时无需删除键。

🌐 Note that the remoteObjectCache stores objects as weak references, so there is no need to delete the key when the object is garbage collected.

原生代码​

🌐 Native code

对于对 Electron 中弱引用的 C++ 代码感兴趣的人，可以在以下文件中找到：

🌐 For people interested in the C++ code of weak references in Electron, it can be found in following files:

setDestructor API:

🌐 The setDestructor API:

• object_life_monitor.cc
• object_life_monitor.h

createIDWeakMap API：

🌐 The createIDWeakMap API:

• key_weak_map.h
• atom_api_key_weak_map.h