メインコンテンツへ飛ぶ

なぜ Electron なのか

Electronは、ウェブ技術（HTML、JavaScript、CSS）とNode.js、そしてネイティブコードを組み合わせることで、macOS、Windows、Linux向けのクロスプラットフォームデスクトップアプリケーションを開発できるフレームワークです。 本ソフトウェアは、オープンソースのMITライセンスに基づき、商用・非商用の目的を問わず、無償でご利用いただけます。 このドキュメントでは、なぜ企業や開発者が Electron を選ぶのかをご説明します。

Electronのメリットは2つの質問に分けることができます。まず、アプリケーションの構築に Web テクノロジーを使うべきなのか？ そして、なぜそのフレームワークとして Electron を選ぶべきなのか？

もしあなたがすでにアプリケーションにウェブ技術を使用している場合、下の章「Electronを選ぶ理由」からご覧ください。

ウェブ技術を選ぶ理由​

Web 技術には HTML や CSS、JavaScript、WebAssembly などがあります。 これらは現代のインターネットの「顔」と言えるものです。 これらの技術は、消費者向けアプリケーションだけでなく、ミッションクリティカルなビジネスアプリケーションにもユーザーインターフェースを構築するための最適な選択肢として登場しました。 これは、ブラウザ上で実行する必要があるアプリケーションだけでなく、ブラウザからアクセスできないデスクトップアプリケーションにも当てはまります。 ここでの我々の主張は、これが単に複数のオペレーティングシステムで動作する必要のあるクロスプラットフォームアプリケーションに限らず、あらゆるアプリケーションに当てはまるというものです。

例えば、NASA の実際のミッションコントロールは Web 技術を使って書かれています。 金融機関で使われているコンピュータシステム、ブルームバーグ ターミナルも Web 技術で書かれており、 Chromium 内で動作しています。 そのコストは年間1ユーザーあたり25,000ドルです。 世界最大の飲食小売業者であるマクドナルドの注文端末も、完全に Chromium で構築されています。 SpaceX のドラゴン2宇宙カプセルは、インターフェースを表示するために Chromium を使用しています。 要するに、Web 技術はユーザーインターフェースを構築するのに優れた技術スタックであるということです。

Electron のメンテナンスを行っている私たちが Web 技術に賭ける理由をご紹介します。

汎用性​

現代の HTML や CSS により、開発者やデザイナーは自身の表現力を十分に発揮できます。 Web のショーケースには、Google Earth、Netflix、Spotify、Gmail、Facebook、Airbnb、GitHub などがあります。 あなたのアプリケーションがどのようなインターフェースを必要としていても、HTML、CSS、そして JavaScript を使えば表現できます。

特定の UI フレームワークでデザイナーのビジョンをどう実現するかを考えるのではなく、素晴らしい製品づくりに集中したいなら、Web は安全な選択肢です。

信頼性​

Web 技術は、地球上でもっとも広く使われているユーザーインターフェースの基盤です。 それゆえに徹底的に強化されてきました。 現代のコンピュータは、CPU からオペレーティングシステムに至るまで、Web 技術を効率よく実行できるよう最適化されています。 Android スマートフォンでも最新の MacBook でも、ユーザーがウェブサイトを閲覧したり、YouTube で動画を再生したり、メールを表示したりできるように、端末メーカーが保証しています。 その結果、ユーザーが一人しかいなくても、あなたのアプリが安定した基盤の上で動作することが保証されるのです。

誰も遭遇したことのない奇妙な挙動をデバッグするのではなく、素晴らしい製品づくりに集中したいなら、Web は安全な選択肢です。

相互運用性​

あなたが扱う必要のあるプロバイダや顧客データは、ほぼ確実に Web との連携経路が用意されています。 どの技術を選ぶかによって、YouTube 動画の埋め込みが 30 秒で済むこともあれば、ストリーミングやハードウェアアクセラレーションによる動画デコードの専門チームを雇う必要があることもあります。 YouTube の場合、提供されているプレーヤー以外を使うことは利用規約に反するため、独自の動画ストリーミングデコーダを実装するのではなく、ブラウザフレームを埋め込むことになるでしょう。

Web 技術でアプリを作れば、動作しないプラットフォームは事実上存在しません。 ATM、車載インフォテインメントシステム、スマートテレビ、冷蔵庫、Nintendo Switch など、画面を持つほとんどのデバイスは Web 技術を表示できます。 クロスプラットフォームを目指すなら、Web は安全な選択肢です。

遍在性​

Web 技術の経験を持つ開発者を見つけるのは簡単です。 あなたが開発者であれば、Google、Stack Overflow、GitHub、あるいはお好みのコーディング AI を使って質問の答えを見つけるのも容易でしょう。 あなたが解決しようとしている問題は、ほぼ確実に過去に誰かが解決しており、その答えはインターネットで見つけられます。

豊富なリソースや資料にアクセスしながら素晴らしい製品づくりに集中したいなら、Web は安全な選択肢です。

Electronを選ぶ理由​

Electronは、Chromium、Node.js、およびカスタムネイティブコードを1つのフレームワークに書き込む機能を組み合わせて、強力なデスクトップアプリケーションを構築します。 主な理由は次の 3 つです。

エンタープライズグレード​

Electron は信頼性があり、安全で、安定しており、成熟しています。 主力製品を構築する企業にとって、これは最良の選択肢です。 当社のホームページにはそうした企業の一部がリストされていますが、チャット アプリだけでも、Slack、Discord、Signal が Electron で構築されています。 AIアプリケーションの中で、OpenAIのChatGPTとAnthropicのClaudeはどちらもElectronを使用しています。 Visual Studio Code、Loom、Canva、Notion、Docker、その他数え切れ​​ないほどの大手ソフトウェア開発者がElectronに賭けています。

私たちは、Electron を使いやすくし、開発者にとって喜ばしいものにすることを優先しました。 これがおそらく、Electron が今日のように人気を博した主な理由でしょう。しかし、Electron が生き残り、繁栄し続けているのは、メンテナーが Electron を可能な限り安定させ、安全で、パフォーマンスが高く、エンドユーザーにとってミッションクリティカルなユースケースに対応できるようにすることに重点を置いているからです。 私たちは、バグが直せない状況やセキュリティパッチを当てられない環境、あらゆる障害が致命的になり得るケースでも安心して使える Electron を目指しています。

成熟​

私たちの現在の推定では、地球上のほとんどのデスクトップ コンピューターは少なくとも 1 つの Electron アプリを実行しています。 Electron は、メンテナー グループの才能を優先し、継続的なメンテナンスの管理において優れた持続可能なエンジニアリング手法を促進し、Electron に賭ける企業を積極的に招待してプロジェクトに直接貢献することで成長してきました。 私たちは OpenJS Foundation のインパクトプロジェクトとして活動しており、OpenJS Foundation は Linux Foundation の傘下にあります。 Node.js、ESLint、Webpack、Linux Kernel、Kubernetesなどの他の基盤プロジェクトとリソースと専門知識を共有しています。

実際に開発者であるあなたにとって、それらは何を意味するのでしょうか?

  • 信頼できるリリースサイクル: Electron は Chromium のメジャーリリース 2 回につき 1 回、新しいメジャーバージョンを Chromium と足並みをそろえてリリースします。通常は Chromium と同日に公開されます。 これを実現するには、プロセスとツールの構築という形だけでなく、毎週の実際の投資時間という形でも、多くの作業を行う必要があります。
  • 独裁者なし: テクノロジーに賭けるには、一人または会社に賭ける必要がある場合もあります。 次に、人または会社が決して壊れていないことを信頼する必要があります。 直接あなたと戦うのか、あるいは他のどんなことでも、あなたはあなたの技術スタック全体を再考することになります。 Electronは多様な企業(Microsoft、Slack/Salesforce、Notion)によって管理されています。 そして、より多くの企業が「意思決定テーブルにおける座席」を確保することに興味を持っていることを歓迎し続けます。

安定性、セキュリティ、パフォーマンス​

Electronは、Chromium、V8、Nodeの最新バージョンをバンドルすることで、すべてのターゲットプラットフォーム(macOS、Windows、Linux)で最高のエクスペリエンスを提供します。 アプリケーション・バイナリと直接。 最高の安定性、セキュリティ、パフォーマンスを備えた Web コンテンツの実行とレンダリングに関しては、現在、そのスタックが「クラス最高」であると考えています。

すべてをまとめる理由​

最近のほとんどのオペレーティング システムにはすでにブラウザーと何らかの形式の Web ビューが搭載されているのに、なぜ Chromium の Web スタックをアプリにバンドルするのか疑問に思うかもしれません。 バンドルは Electron メンテナの作業量を劇的に増加させるだけではありません。 Electronアプリのディスク容量も増加します（ほとんどのアプリは100MB以上）。 多くの Electron メンテナは、かつて埋め込まれた Web ビューを利用するアプリケーションを開発しました。それ以来、ディスクサイズとメンテナの作業が価値のあるトレードオフとして増加してきました。

オペレーティングシステム内蔵のWebビューを使用する場合、サポートする必要がある最も古いオペレーティングシステムバージョンに含まれるブラウザのバージョンによって制限されます。 私たちは、このアプローチで次の問題を発見しました:

  • 安定性: 最新のWebテクノロジースタックは複雑で、その結果、遅かれ早かれバグに遭遇します。 オペレーティングシステムのWebビューを使用する場合、お客様にオペレーティングシステムのアップグレードを依頼することが唯一の手段です。 そのマシンにアップグレードが利用できない場合（最新の macOS または Windows 11 にアップグレードできないため）、新しいコンピュータを購入するように依頼する必要があります。 運が悪ければ、あるチームがあなたのスタートアップのアプリを試してみたかったという理由だけで、顧客が何千台ものマシン群全体をアップグレードすることはなく、大口顧客を失うことになります。 この状態では recourse がありません。 その危険性でさえ、Electron メンテナを雇っている企業には受け入れられません。
  • セキュリティ: アプリのアップデートをリリースすることで安定性のバグを修正する方法と同様です。 お客様にオペレーティングシステムのアップグレードを依頼することなく、アプリケーションにセキュリティ修正をリリースすることもできます。 オペレーティングシステムプロバイダがビルトインブラウザの更新を優先する場合でも、同様の緊急性を備えたビルトインWebビューを確実に更新することはありません。 ウェブレンダラーをバンドルすると、開発者がコントロールできるようになります。
  • パフォーマンス: シンプルな HTML ドキュメントでは、組み込みの Web ビューでは、バンドルされたフレームワークを持つアプリよりも少ないリソースを使用することがあります。 より大きなアプリの場合 Chromiumの最新バージョンでは、組み込みのWebビューでより良いパフォーマンスを提供することができます私たちの経験です。 組み込みのビューは、他のアプリやオペレーティングシステムと多くのリソースを共有できると思うかもしれませんが、セキュリティ上の理由から。 アプリは互いに隔離された独自のサンドボックスで実行する必要があります その時点で問題は、OSのWebビューがChromiumよりもパフォーマンスが高いのかということです。 多くのアプリケーションで、ChromiumとNode.jsをバンドルすることで、より優れたパフォーマンスの高いエクスペリエンスを構築できます。

ChromiumとNode.jsをバンドルする理由​

Electron は、可能な限り最高のユーザーエクスペリエンスを提供するためにサポートされているアプリを有効にすることを目指しています。続いて、可能な限り最高の開発者エクスペリエンスを提供します。 Chromiumは現在利用可能な最高のクロスプラットフォームレンダリングスタックです。 Node.jsはChromiumのJavaScriptエンジンV8を使用しており、両方の機能を組み合わせることができます。

  • 必要なときにネイティブコード: Node.jsの成熟したネイティブアドオンシステムのおかげで、いつでもネイティブコードを書くことができます。 There is no system API out of reach for you. Whatever macOS, Windows, or Linux feature you’ll want to integrate with —as long as you can do it in C, C++, Objective-C, Rust, or another native language, you’ll be able to do it in Electron. Again, this gives you, the developer, maximum control. With Electron, you can use web technologies without choosing only web technologies.

Developer experience​

To summarize, we aim to build an Electron that is mature, enterprise-grade, and ready for mission-critical applications. We prioritize reliability, stability, security, and performance. That said, you might also choose Electron for its developer experience:

  • Powerful ecosystem: Anything you find on npm will run inside Electron. Any resource available to you about how to work with Node.js also applies to Electron. In addition, Electron itself has a thriving ecosystem — including plenty of choices for installers, updaters, deeper operating system-integration, and more.
  • Plenty of built-in capabilities: Over the last ten years, Electron’s core has gained plenty of native capabilities that you might need to build your application. Written in C++ and Objective-C, Electron has dozens of easy-to-use APIs for deeper operating-system integration — like advanced window customization for transparent or oddly shaped widgets, receiving push notifications from the Apple Push Notification Network, or handling a custom URL protocol for your app.
  • Open source: The entire stack is open source and open to your inspection. This ensures your freedom to add any feature or fix any bug you might encounter in the future.
  • Native code when you need it: It bears repeating that Electron allows you to mix and match web technologies and C++, C, Objective-C, Rust, and other native languages. Whether it be SQLite, a whole LLM, or just the ability to call one specific native API, Electron will make it easy.

Why choose something else​

As outlined above, the web is an amazing platform for building interfaces. That doesn’t mean that we, the maintainers, would build everything with HTML and CSS. Here are some notable exceptions:

Resource-Constrained Environments and IoT: In scenarios with very limited memory or processing power (say, one megabyte of memory and 100MHz of processing power on a low-powered ARM Cortex-M), you will likely need to use a low-level language to directly talk to the display to output basic text and images. Even on slightly higher-powered single-chip devices you might want to consider an embedded UI framework. A classic example is a smart watch.

Small Disk Footprint: Zipped Electron apps are usually around 80 to 100 Megabytes. If a smaller disk footprint is a hard requirement, you’ll have to use something else.

Operating System UI Frameworks and Libraries: By allowing you to write native code, Electron can do anything a native application can do, including the use of the operating system’s UI components, like WinUI, SwiftUI, or AppKit. In practice, most Electron apps make rare use of that ability. If you want the majority of your app to be built with operating system-provided interface components, you’ll likely be better off building fully native apps for each operating system you’d like to target. It’s not that it’s impossible with Electron, it’ll just likely be an overall easier development process.

Games and Real-Time Graphics: If you're building a high-performance game or application requiring complex real-time 3D graphics, native frameworks like Unity, Unreal Engine, or DirectX/OpenGL will provide better performance and more direct access to graphics hardware. Web fans might point out caveats, like the fact that even Unreal Engine ships with Chromium — or that WebGPU and WebGL are developing rapidly and many game engines, including the ones listed here, can now output their games in a format that runs in a browser. That said, if you asked us to build the next AAA game, we’d likely use something else than just web technologies.

Embedding Lightweight Websites: Electron apps typically are mostly web apps with native code sprinkled in where useful. Processing-heavy Electron applications tend to write the UI in HTML/CSS and build the backend in Rust, C++, or another native language. If you’re planning to build a primarily native application that also wants to display a little website in a specific view, you might be better off using the OS-provided web view or something like ultralight.