今週のプロジェクト: WebTorrent
今週は、@feross と @dcposch に、WebTorrent について話を聞きました。WebTorrent は、ユーザー同士を接続して分散型で非中央集権的なブラウザ間のネットワークを形成する、ウェブ対応のトレントクライアントです。
WebTorrent とは?
WebTorrent は、ブラウザで動作する初のトレントクライアントです。完全に JavaScript で記述されており、ピアツーピア転送に WebRTC を使用できます。ブラウザのプラグイン、拡張機能、インストールは必要ありません。
オープンウェブ標準を使用することで、WebTorrent はウェブサイトのユーザー同士を接続して、効率的なファイル転送のための分散型で非中央集権的なブラウザ間ネットワークを形成します。
WebTorrent の動作デモはこちらでご覧いただけます: webtorrent.io.

これがクールな理由は?
YouTube のような動画サイトで、訪問者がサイトのコンテンツをホストするのを手伝うようなサイトを想像してみてください。WebTorrent を利用したウェブサイトを利用する人が増えるほど、そのサイトは高速になり、より回復力が高まります。
ブラウザ間の通信は仲介者を排除し、人々が自分たちの条件で通信できるようにします。クライアント/サーバーはもう必要ありません - 単に、すべて平等なピアのネットワークです。WebTorrent は、ウェブの非中央集権化に向けた最初のステップです。
Electron はどのように関わってくるのか?
約1年前、私たちはデスクトップアプリとして動作する WebTorrent のバージョンである WebTorrent Desktop を構築することにしました。
WebTorrent Desktop を作成した理由は3つあります。
- クリーンで軽量、広告なしのオープンソースのトレントアプリが欲しかった
- ストリーミングを良好にサポートするトレントアプリが欲しかった
- BitTorrent と WebTorrent ネットワークを接続する「ハイブリッドクライアント」が必要だった
Web ブラウザでトレントを既にダウンロードできるのに、なぜデスクトップアプリが必要なのか?
まず、WebTorrent の設計に関する背景を少し説明します。

初期の頃、BitTorrent はトランスポートプロトコルとして TCP を使用していました。その後、uTP が登場し、TCP よりも優れたパフォーマンスと追加の利点が期待されました。すべての主流トレントクライアントは最終的に uTP を採用し、今日ではどちらのプロトコルでも BitTorrent を使用できます。WebRTC プロトコルは次の論理的なステップです。Web ブラウザとの相互運用性、つまり、すべてのデスクトップ BitTorrent クライアントと数百万の Web ブラウザで構成される巨大な P2P ネットワークを実現する可能性をもたらします。
「ウェブピア」(Web ブラウザで実行されるトレントピア)は、数百万の新しいピアを追加し、BitTorrent を数十の新しいユースケースに広めることで、BitTorrent ネットワークを強化します。WebTorrent は、既存の BitTorrent クライアントが WebTorrent のサポートを簡単に追加できるように、BitTorrent 仕様に可能な限り忠実に従っています。
Vuze のような一部のトレントアプリは既にウェブピアをサポートしていますが、他のアプリがサポートを追加するのを待つ必要はありませんでした。つまり、WebTorrent Desktop は、WebTorrent プロトコルの採用を加速するための私たちの方法でした。人々が本当に使いたいと思う素晴らしいトレントアプリを作成することで、ウェブピア(つまり、ウェブサイトのユーザー)とトレントを共有できるネットワーク内のピアの数を増やします。
人々が既にできると知っていること以外に、トレントの興味深いユースケースは何ですか?
WebTorrent の最もエキサイティングな用途の1つは、ピア支援配信です。Wikipedia や Internet Archive のような非営利プロジェクトは、訪問者に協力を求めることで、帯域幅とホスティングコストを削減できます。人気のあるコンテンツは、ブラウザ間で高速かつ安価に配信できます。アクセス頻度の低いコンテンツは、オリジンサーバーから HTTP 経由で信頼性の高い方法で配信できます。
Internet Archive は実際に、WebTorrent でうまく機能するようにトレントファイルを更新しました。そのため、Internet Archive のコンテンツをサイトに埋め込みたい場合は、アーカイブのホスティングコストを削減し、ウェブのアーカイブに実際により多くのお金を費やすことができる方法で行うことができます。
CDN から P2P を介したアプリ配信まで、エキサイティングなビジネスユースケースもあります。
WebTorrent を使用するお気に入りのプロジェクトは何ですか?
WebTorrent で構築された最もクールなものは、おそらく Gaia 3D Star Map でしょう。これは、天の川の洗練された 3D インタラクティブシミュレーションです。データは、ブラウザ内で直接トレントからロードされます。私たちの星系を飛び回り、私たち人間が宇宙の広大さに比べていかに小さいかを実感するのは、畏敬の念を抱かせます。
このアプリの作成方法については、Torrenting The Galaxyというブログ記事で読むことができます。この記事で、著者であるCharlie Hoeyが、WebGLとWebTorrentを使って星の地図をどのように作成したかを説明しています。

私たちはBraveも非常に気に入っています。Braveは、広告とトラッカーを自動的にブロックし、ウェブをより速く、より安全にするブラウザです。Braveは最近、トレントのサポートを追加したため、別のアプリを使わずに従来のトレントを閲覧できます。この機能はWebTorrentによって実現されています。
つまり、ほとんどのブラウザがPDFファイルをレンダリングできるのと同じように、Braveはマグネットリンクとトレントファイルをレンダリングできます。それらは、ブラウザがネイティブにサポートするコンテンツの一種にすぎません。
Braveの共同創設者の1人は、実はWebTorrentを書いた言語であるJavaScriptの作成者であるBrendan Eichです。そのため、BraveがWebTorrentを統合することを選んだのは非常にクールだと思っています。
なぜWebTorrent DesktopをElectronで構築することにしたのですか?

Electronアプリは、すべてのアプリにChromeのコンテンツモジュール全体が含まれるため、「肥大化している」というミームがあります。一部の場合、これは部分的に真実です(Electronアプリのインストーラーは通常〜40MBですが、OS固有のアプリのインストーラーは通常〜20MBです)。
ただし、WebTorrent Desktopの場合、通常の操作の中でほぼすべてのElectron機能と、数十のChrome機能を使用しています。これらの機能をプラットフォームごとにゼロから実装しようとした場合、アプリの構築に数ヶ月または数年長くかかったり、単一のプラットフォームのみにしかリリースできなかったりしたでしょう。
例として、Electronのドック統合(ダウンロードの進行状況を表示するため)、メニューバー統合(バックグラウンドで実行するため)、プロトコルハンドラー登録(マグネットリンクを開くため)、省電力ブロッカー(ビデオ再生中のスリープを防ぐため)、自動更新を使用しています。Chrome機能としては、<video>
タグ(多くの異なるビデオ形式を再生するため)、<track>
タグ(字幕サポートのため)、ドラッグアンドドロップサポート、およびWebRTC(ネイティブアプリで使用するのは簡単ではありません)を多く使用しています。
言うまでもなく、私たちのトレントエンジンはJavaScriptで書かれており、多くのNode API、特にTCPおよびUDPソケットサポートのためにrequire('net')
とrequire('dgram')
の存在を前提としています。
基本的に、Electronはまさに私たちが必要としていたものであり、確固とした洗練されたアプリを記録的な速さで出荷するために必要な機能が正確に揃っていました。
Electronの一番好きなところは何ですか?
WebTorrentライブラリは、オープンソースのサイドプロジェクトとして2年間開発されてきました。WebTorrent Desktopは4週間で作成しました。Electronは、私たちがこれほど迅速にアプリを構築し、出荷できた主な理由です。
Node.jsがjQueryを使用するフロントエンドプログラマーの世代にサーバープログラミングをアクセス可能にしたように、ElectronはWebまたはNode.js開発に精通している人なら誰でもネイティブアプリ開発をアクセス可能にします。Electronは非常に強力です。
ウェブサイトとデスクトップクライアントはコードを共有していますか?
はい、webtorrent
npmパッケージはNode.js、ブラウザ、Electronで動作します。まったく同じコードがすべての環境で実行できます。これがJavaScriptの美しさです。これは今日の普遍的なランタイムです。Javaアプレットは「一度書けば、どこでも実行できる」アプリを約束しましたが、いくつかの理由でそのビジョンは実現しませんでした。Electronは、他のどのプラットフォームよりも、その理想に非常に近づいています。
WebTorrentの構築中に直面した課題は何ですか?
アプリの初期バージョンでは、UIをパフォーマンス良くすることができませんでした。トレントエンジンをメインアプリウィンドウを描画するのと同じレンダラープロセスに入れたため、予想どおり、トレントエンジンからの集中的なCPUアクティビティ(ピアから受信したトレントピースの検証など)があるたびに遅くなりました。
この問題を解決するために、トレントエンジンを2番目の非表示のレンダラープロセスに移動し、IPCで通信するようにしました。こうすることで、そのプロセスが一時的に大量のCPUを使用した場合でも、UIスレッドは影響を受けません。なめらかでスムーズなスクロールとアニメーションは非常に満足です。
注:WebRTC(レンダラーでのみ利用可能)にアクセスする必要があるため、トレントエンジンを「メイン」プロセスではなく、レンダラープロセスに入れる必要がありました。
Electronはどの分野で改善されるべきですか?
私たちが望んでいることの1つは、コード署名や自動更新のような難しいテーマを中心に、本番環境対応のアプリを構築および出荷する方法に関するより良いドキュメントです。ベストプラクティスについては、ソースコードを掘り下げたり、Twitterで尋ねたりして学ぶ必要がありました!
WebTorrent Desktopは完成しましたか?もしそうでなければ、次はどうなりますか?
現在のバージョンのWebTorrent Desktopは優れていると思いますが、常に改善の余地はあります。現在、洗練さ、パフォーマンス、字幕サポート、ビデオコーデックサポートの改善に取り組んでいます。
プロジェクトへの参加に関心がある場合は、GitHubページをご覧ください。
他の開発者に役立つ可能性のあるElectron開発のヒントはありますか?
WebTorrent Desktopの貢献者の1人であるFerossは、最近、NodeConf Argentinaで「現実世界のElectron:JavaScriptでクロスプラットフォームのデスクトップアプリを構築する」という講演を行いました。この講演には、洗練されたElectronアプリをリリースするための役立つヒントが含まれています。この講演は、基本的な動作アプリがあり、それを次のレベルの洗練さとプロフェッショナリズムに引き上げようとしている段階にある場合に特に役立ちます。
WebTorrentのもう1人の貢献者であるDCは、アプリを洗練されたネイティブなものにするためのチェックリストを作成しました。コード例が付属しており、macOSのドック統合、ドラッグアンドドロップ、デスクトップ通知、アプリが迅速にロードされるようにすることなどをカバーしています。