本周项目：WebTorrent
本周，我们采访了 @feross 和 @dcposch，一起探讨了 WebTorrent。这是一款基于 Web 的种子客户端，它将用户连接在一起，形成一个分布式、去中心化的浏览器到浏览器网络。
¥This week we caught up with @feross and @dcposch to talk about WebTorrent, the web-powered torrent client that connects users together to form a distributed, decentralized browser-to-browser network.
什么是 WebTorrent？
¥What is WebTorrent?
WebTorrent 是第一个在浏览器中运行的 torrent 客户端。它完全用 JavaScript 编写，可以使用 WebRTC 进行点对点传输。无需浏览器插件、扩展程序或安装。
¥WebTorrent is the first torrent client that works in the browser. It's written completely in JavaScript and it can use WebRTC for peer-to-peer transport. No browser plugin, extension, or installation is required.
WebTorrent 使用开放的 Web 标准，将网站用户连接在一起，形成一个分布式、去中心化的浏览器到浏览器网络，以实现高效的文件传输。
¥Using open web standards, WebTorrent connects website users together to form a distributed, decentralized browser-to-browser network for efficient file transfer.
你可以在此处查看 WebTorrent 的实际演示：webtorrent.io。
¥You can see a demo of WebTorrent in action here: webtorrent.io.
为什么这很酷？
¥Why is this cool?
想象一个像 YouTube 这样的视频网站，但访问者可以参与托管网站的内容。使用 WebTorrent 驱动的网站的人越多，它的速度就越快，弹性也就越强。
¥Imagine a video site like YouTube, but where visitors help to host the site's content. The more people that use a WebTorrent-powered website, the faster and more resilient it becomes.
浏览器之间的通信省去了中间人，让人们可以按照自己的方式进行交流。不再使用客户端/服务器模式 - 只创建一个对等网络，所有对等网络均平等。WebTorrent 是重新去中心化 Web 之旅的第一步。
¥Browser-to-browser communication cuts out the middle-man and lets people communicate on their own terms. No more client/server – just a network of peers, all equal. WebTorrent is the first step in the journey to re-decentralize the Web.
Electron 在其中扮演什么角色？
¥Where does Electron come into the picture?
大约一年前，我们决定构建 WebTorrent 桌面版，一个作为桌面应用运行的 WebTorrent 版本。
¥About one year ago, we decided to build WebTorrent Desktop, a version of WebTorrent that runs as a desktop app.
我们创建 WebTorrent Desktop 有三个原因：
¥We created WebTorrent Desktop for three reasons:
-
我们想要一款简洁、轻量、无广告的开源种子应用。
¥We wanted a clean, lightweight, ad-free, open source torrent app
-
我们想要一个能够良好支持流媒体的种子应用。
¥We wanted a torrent app with good streaming support
-
我们需要一个 "混合客户端" 来连接 BitTorrent 和 WebTorrent 网络。
¥We need a "hybrid client" that connects the BitTorrent and WebTorrent networks
如果我们已经可以在 Web 浏览器中下载种子，为什么还要开发桌面应用？
¥If we can already download torrents in my web browser, why a desktop app?
首先，简单介绍一下 WebTorrent 的设计背景。
¥First, a bit of background on the design of WebTorrent.
早期，BitTorrent 使用 TCP 作为其传输协议。后来，uTP 应运而生，承诺提供比 TCP 更佳的性能和其他优势。每个主流 torrent 客户端最终都采用了 uTP，如今你可以通过任一协议使用 BitTorrent。WebRTC 协议是下一个合乎逻辑的步骤。它带来了与 Web 浏览器互操作的希望 - 一个由所有桌面 BitTorrent 客户端和数百万 Web 浏览器组成的巨型 P2P 网络。
¥In the early days, BitTorrent used TCP as its transport protocol. Later, uTP came along promising better performance and additional advantages over TCP. Every mainstream torrent client eventually adopted uTP, and today you can use BitTorrent over either protocol. The WebRTC protocol is the next logical step. It brings the promise of interoperability with web browsers – one giant P2P network made up of all desktop BitTorrent clients and millions of web browsers.
“Web peers”（在 Web 浏览器中运行的 torrent peers）通过增加数百万个新 peers，并将 BitTorrent 扩展到数十个新的用例，使 BitTorrent 网络更加强大。WebTorrent 尽可能严格地遵循 BitTorrent 规范，以便现有的 BitTorrent 客户端轻松添加对 WebTorrent 的支持。
¥“Web peers” (torrent peers that run in a web browser) make the BitTorrent network stronger by adding millions of new peers, and spreading BitTorrent to dozens of new use cases. WebTorrent follows the BitTorrent spec as closely as possible, to make it easy for existing BitTorrent clients to add support for WebTorrent.
一些种子应用（例如 Vuze）已经支持 Web 端，但我们不想等待其他应用添加支持。所以，WebTorrent Desktop 基本上是我们加速 WebTorrent 协议普及的一种方式。通过制作一款人们真正想要使用的优秀 torrent 应用，我们增加了网络中可以与 Web 用户（即网站上的用户）共享 torrent 的对等体数量。
¥Some torrent apps like Vuze already support web peers, but we didn't want to wait around for the rest to add support. So basically, WebTorrent Desktop was our way to speed up the adoption of the WebTorrent protocol. By making an awesome torrent app that people really want to use, we increase the number of peers in the network that can share torrents with web peers (i.e. users on websites).
除了人们已知的功能之外，torrent 还有哪些有趣的用例？
¥What are some interesting use cases for torrents beyond what people already know they can do?
WebTorrent 最令人兴奋的用途之一是同伴协助交付。像 维基百科 和 互联网档案馆 这样的非营利项目可以通过让访问者参与进来来降低带宽和托管成本。热门内容可以快速且经济地在浏览器之间传输。很少访问的内容可以通过 HTTP 从源服务器可靠地提供。
¥One of the most exciting uses for WebTorrent is peer-assisted delivery. Non-profit projects like Wikipedia and the Internet Archive could reduce bandwidth and hosting costs by letting visitors chip in. Popular content can be served browser-to-browser, quickly and cheaply. Rarely-accessed content can be served reliably over HTTP from the origin server.
互联网档案馆实际上已经更新了他们的种子文件，使其能够与 WebTorrent 完美兼容。因此，如果你想在网站上嵌入互联网档案馆的内容，你可以采用一种降低档案馆托管成本的方式，让他们能够将更多资金投入到实际的网络存档工作中！
¥The Internet Archive actually already updated their torrent files so they work great with WebTorrent. So if you want to embed Internet Archive content on your site, you can do it in a way that reduces hosting costs for the Archive, allowing them to devote more money to actually archiving the web!
还有一些令人兴奋的商业用例，从 CDN 到通过 P2P 交付应用。
¥There are also exciting business use cases, from CDNs to app delivery over P2P.
你最喜欢的使用 WebTorrent 的项目有哪些？
¥What are some of your favorite projects that use WebTorrent?
毫无疑问，用 WebTorrent 构建的最酷的东西可能是 Gaia 3D 星图。它是一个流畅的银河系 3D 交互式模拟。数据直接从浏览器中的 torrent 加载。飞越我们的星系，意识到我们人类与浩瀚的宇宙相比是多么渺小，这令人惊叹。
¥The coolest thing built with WebTorrent, hands down, is probably Gaia 3D Star Map. It's a slick 3D interactive simulation of the Milky Way. The data loads from a torrent, right in your browser. It's awe-inspiring to fly through our star system and realize just how little we humans are compared to the vastness of our universe.
你可以在 Torrenting Galaxy 中了解它的实现过程，这是一篇博客文章，作者 Charlie Hoey 在其中解释了他如何使用 WebGL 和 WebTorrent 构建星图。
¥You can read about how this was made in Torrenting The Galaxy, a blog post where the author, Charlie Hoey, explains how he built the star map with WebGL and WebTorrent.
我们也是 Brave 的忠实粉丝。Brave 是一款自动屏蔽广告和追踪器的浏览器，可以让网络速度更快、更安全。Brave 最近添加了 torrent 支持，因此你可以使用 无需使用单独应用即可查看传统种子。该功能由 WebTorrent 提供支持。
¥We're also huge fans of Brave. Brave is a browser that automatically blocks ads and trackers to make the web faster and safer. Brave recently added torrent support, so you can view traditional torrents without using a separate app. That feature is powered by WebTorrent.
因此，就像大多数浏览器可以渲染 PDF 文件一样，Brave 也可以渲染磁力链接和种子文件。它们只是浏览器原生支持的另一种内容类型。
¥So, just like how most browsers can render PDF files, Brave can render magnet links and torrent files. They're just another type of content that the browser natively supports.
Brave 的联合创始人之一实际上是 Brendan Eich，他是 JavaScript 的创造者，而 JavaScript 正是我们编写 WebTorrent 所用的语言，因此我们认为 Brave 选择集成 WebTorrent 非常酷。
¥One of the co-founders of Brave is actually Brendan Eich, the creator of JavaScript, the language we wrote WebTorrent in, so we think it's pretty cool that Brave chose to integrate WebTorrent.
为什么选择在 Electron 上构建 WebTorrent 桌面？
¥Why did you choose to build WebTorrent Desktop on Electron?
有种说法是 Electron 应用是 "bloated"，因为它们在每个应用中都包含完整的 Chrome 内容模块。在某些情况下，这部分正确（Electron 应用安装程序通常约为 40MB，而特定于操作系统的应用安装程序通常约为 20MB）。
¥There is a meme that Electron apps are "bloated" because they include the entire Chrome content module in every app. In some cases, this is partially true (an Electron app installer is usually ~40MB, where an OS-specific app installer is usually ~20MB).
然而，就 WebTorrent 桌面版而言，我们在正常运行过程中几乎使用了所有 Electron 功能以及数十项 Chrome 功能。如果我们想为每个平台从头开始实现这些功能，那么构建我们的应用将需要数月甚至数年的时间，或者我们只能为单个平台发布应用。
¥However, in the case of WebTorrent Desktop, we use nearly every Electron feature, and many dozens of Chrome features in the course of normal operation. If we wanted to implement these features from scratch for each platform, it would have taken months or years longer to build our app, or we would have only been able to release for a single platform.
为了便于理解，我们使用了 Electron 的 Dock 集成（用于显示下载进度）、菜单栏集成（用于在后台运行）、协议处理程序注册（用于打开磁力链接）、省电阻止程序（用于防止视频播放期间进入睡眠状态）和 自动更新程序。至于 Chrome 特性，我们大量使用了以下特性：<video> 标签（用于播放多种不同的视频格式）、<track> 标签（用于支持隐藏字幕）、拖放支持以及 WebRTC（在原生应用中使用起来并不简单）。
¥Just to get an idea, we use Electron's dock integration (to show download progress), menu bar integration (to run in the background), protocol handler registration (to open magnet links), power save blocker (to prevent sleep during video playback), and automatic updater. As for Chrome features, we use plenty: the <video> tag (to play many different video formats), the <track> tag (for closed captions support), drag-and-drop support, and WebRTC (which is non-trivial to use in a native app).
另请参阅：我们的 torrent 引擎用 JavaScript 编写，并假设存在许多 Node API，尤其是 require('net') 和 require('dgram')，用于 TCP 和 UDP 套接字支持。
¥Not to mention: our torrent engine is written in JavaScript and assumes the existence of lots of Node APIs, but especially require('net') and require('dgram') for TCP and UDP socket support.
基本上，Electron 正是我们所需要的，它拥有我们在创纪录的时间内交付一个稳定、精致的应用所需的全部功能。
¥Basically, Electron is just what we needed and had the exact set of features we needed to ship a solid, polished app in record time.
你最喜欢 Electron 的哪些方面？
¥What are your favorite things about Electron?
WebTorrent 库作为开源项目已经开发了两年。我们用四周时间制作了 WebTorrent 桌面版。Electron 是我们能够如此快速地构建和发布应用的主要原因。
¥The WebTorrent library has been in development as an open source side project for two years. We made WebTorrent Desktop in four weeks. Electron is the primary reason that we were able to build and ship our app so quickly.
正如 Node.js 让使用 jQuery 的一代前端程序员能够轻松进行服务器编程一样，Electron 也让任何熟悉 Web 或 Node.js 开发的人都能轻松进行原生应用开发。Electron 功能极其强大。
¥Just as Node.js made server programming accessible to a generation of jQuery-using front-end programmers, Electron makes native app development accessible to anyone familiar with Web or Node.js development. Electron is extremely empowering.
网站和桌面客户端共享代码吗？
¥Do the website and the Desktop client share code?
是的，webtorrent npm 包 可以在 Node.js、浏览器和 Electron 中运行。完全相同的代码可以在所有环境中运行 - 这就是 JavaScript 的魅力所在。它是当今的通用运行时。Java Applets 承诺推出 "一次编写，随处运行" 应用，但由于多种原因，这一愿景从未真正实现。实际上，Electron 比任何其他平台都更接近这一理想状态。
¥Yes, the webtorrent npm package works in Node.js, in the browser, and in Electron. The exact same code can run in all environments – this is the beauty of JavaScript. It's today's universal runtime. Java Applets promised "Write Once, Run Anywhere" apps, but that vision never really materialized for a number of reasons. Electron, more than any other platform, actually gets pretty darn close to that ideal.
在构建 WebTorrent 时，你遇到了哪些挑战？
¥What are some challenges you've faced while building WebTorrent?
在应用的早期版本中，我们努力提高 UI 的性能。我们将 torrent 引擎与绘制主应用窗口的渲染进程放在了同一个渲染进程中，不出所料，当 torrent 引擎的 CPU 活动非常频繁时（例如验证从其他用户收到的 torrent 片段），会导致系统运行缓慢。
¥In early versions of the app, we struggled to make the UI performant. We put the torrent engine in the same renderer process that draws the main app window which, predictably, led to slowness anytime there was intense CPU activity from the torrent engine (like verifying the torrent pieces received from peers).
我们通过将 torrent 引擎移至第二个不可见的渲染进程来解决这个问题，该进程通过 IPC 进行通信。这样，即使该进程短暂地占用了大量 CPU，UI 线程也不会受到影响。流畅的滚动和动画效果令人非常满意。
¥We fixed this by moving the torrent engine to a second, invisible renderer process that we communicate with over IPC. This way, if that process briefly uses a lot of CPU, the UI thread will be unaffected. Buttery-smooth scrolling and animations are so satisfying.
注意：我们必须将 torrent 引擎放在渲染器进程中，而不是 "main" 进程中，因为我们需要访问 WebRTC（它仅在渲染器中可用）。
¥Note: we had to put the torrent engine in a renderer process, instead of a "main" process, because we need access to WebRTC (which is only available in the renderer.)
Electron 应该在哪些方面改进？
¥In what areas should Electron be improved?
我们希望看到更好的文档，介绍如何构建和发布可用于生产环境的应用，尤其是在代码签名和自动更新等棘手问题上。我们必须通过深入研究源代码并在 Twitter 上四处咨询来学习最佳实践！
¥One thing we'd love to see is better documentation about how to build and ship production-ready apps, especially around tricky subjects like code signing and auto-updating. We had to learn about best practices by digging into source code and asking around on Twitter!
WebTorrent Desktop 完成了吗？如果不行，下一步是什么？
¥Is WebTorrent Desktop done? If not, what's coming next?
我们认为 WebTorrent Desktop 的当前版本非常出色，但仍有改进的空间。我们目前正在改进代码、性能、字幕支持和视频编解码器支持。
¥We think the current version of WebTorrent Desktop is excellent, but there's always room for improvement. We're currently working on improving polish, performance, subtitle support, and video codec support.
如果你有兴趣参与该项目，请查看 我们的 GitHub 页面！
¥If you're interested in getting involved in the project, check out our GitHub page!
有哪些 Electron 开发技巧可能对其他开发者有用？
¥Any Electron development tips that might be useful to other developers?
WebTorrent 桌面贡献者之一 Feross 最近发表了题为“真实世界的 Electron：在阿根廷 NodeConf 大会上，我们将举办“使用 JavaScript 构建跨平台桌面应用”活动，其中包含发布优质 Electron 应用的实用技巧。如果你正处于拥有一个基本可运行的应用的阶段，并希望将其提升到更高的完善度和专业性，那么本次演讲将特别有用。
¥Feross, one of the WebTorrent Desktop contributors, recently gave a talk "Real world Electron: Building Cross-platform desktop apps with JavaScript" at NodeConf Argentina that contains useful tips for releasing a polished Electron app. The talk is especially useful if you're at the stage where you have a basic working app and you're trying to take it to the next level of polish and professionalism.
DC 是另一位 WebTorrent 贡献者，他编写了 一份你可以执行的操作清单，旨在让你的应用更加精致，更具原生体验。它附带代码示例，涵盖了 macOS 停靠栏集成、拖放、桌面通知以及确保应用快速加载等功能。
¥DC, another WebTorrent contributor, wrote a checklist of things you can do to make your app feel polished and native. It comes with code examples and covers things like macOS dock integration, drag-and-drop, desktop notifications, and making sure your app loads quickly.