Electron 40.0.0 がリリースされました! これには Chromium 144.0.7559.60、V8 14.4、Node 24.11.1 へのアップグレードが含まれています。
Electron チームは、Electron 40.0.0 のリリース発表にワクワクしています! npm install electron@latest から npm でインストールするか、リリースウェブサイト からダウンロードできます。 このリリースの詳細は続きをご覧ください。
何かフィードバックがあれば、Bluesky や Mastodon で共有したり、コミュニティの Discord に参加してみましょう! バグや機能の要望は Electron の Issue トラッカー で報告できます。
私たちは、Electron での取り組みを垣間見られる新しいブログ投稿シリーズを開始します。 この働きに興味を感じましたら、貢献をご検討ください！
最近、私は Electron と Chromium のウインドウのサイズ変更動作の改善に取り組みました。
Windows では、ウインドウのサイズを変更すると以下のように古いフレームが表示されるという問題が発生していました。
このようなバグの場合、最初の課題は調べ始めを把握することです。
Electron は、Google Chrome のオープンソース版である Chromium をベースに構築されています。 Electron をコンパイルするとき、Electron のソースコードがサブディレクトリとして Chromium のソースツリーに追加されます。 Electron は、最新ブラウザの機能を提供するためにそののほとんどを Chromium のコードに依存しています。
Chromium には約 3600 万行のコードがあります。 Electron も大きなプロジェクトです。 この問題の原因となる可能性のあるコードは大量にあります。
12 月 1 日から Electron プロジェクトは安息期間に入り、2026 年 1 月にフル稼働に戻る予定です。 完全な詳細は、ポリシー の節をご参照ください。
2020 年以来、12 月はプロジェクトメンテナが通常のメンテナンス業務から離れて休憩をとったり集中して作業したりする時期となっています。 この休暇は私たちが休息して来たる年に向けて元気を取り戻すのに役立ちます。
とはいえ、こういった 1 か月に及ぶ休止はオープンソースプロジェクトが健全な状態にあるからこそ実現できます。プロジェクトを継続的に推進してくださっているすべてのメンテナと外部貢献者の方々に感謝申し上げます。 ❤️
Electron 39.0.0 がリリースされました! これには Chromium 142.0.7444.52、V8 14.2、Node 22.20.0 へのアップグレードが含まれています。
Electron チームは、Electron 39.0.0 のリリース発表にワクワクしています! npm install electron@latest から npm でインストールするか、リリースウェブサイト からダウンロードできます。 このリリースの詳細は続きをご覧ください。
何かフィードバックがあれば、Bluesky や Mastodon で共有したり、コミュニティの Discord に参加してみましょう! バグや機能の要望は Electron の Issue トラッカー で報告できます。
長年「実験的」機能だったASAR 整合性は、Electron 39 で安定版になりました。 この機能を有効にすると、パッケージされた app.asar が実行時にビルド時のハッシュに対して検証され、改ざんを検出します。 ハッシュが存在しない場合、またはハッシュが一致しない場合は、アプリが強制終了します。
ASAR 整合性のドキュメント から、この機能がどのように機能するか、アプリケーションにどのように活用するか、Electron Forge や Electron Packager でどのように使用するかといった、詳細な情報をご覧いただけます。
関連して、Electron Packager v19 はデフォルトで ASAR が有効になります。 #1841
Electron 38.0.0 がリリースされました! これには Chromium 140.0.7339.41、V8 14.0、Node 22.16.0 へのアップグレードが含まれています。
Electron チームは、Electron 38.0.0 のリリース発表にワクワクしています! npm install electron@latest から npm でインストールするか、リリースウェブサイト からダウンロードできます。 このリリースの詳細は続きをご覧ください。
何かフィードバックがあれば、Bluesky や Mastodon で共有したり、コミュニティの Discord に参加してみましょう! バグや機能の要望は Electron の Issue トラッカー で報告できます。
Electron 37.0.0 がリリースされました! これには Chromium 138、V8 13.8、Node 22.16.0 へのアップグレードが含まれています。
Electron チームは、Electron 37.0.0 のリリース発表にワクワクしています! npm install electron@latest から npm でインストールするか、リリースウェブサイト からダウンロードできます。 このリリースの詳細は続きをご覧ください。
何かフィードバックがあれば、Bluesky や Mastodon で共有したり、コミュニティの Discord に参加してみましょう! バグや機能の要望は Electron の Issue トラッカー で報告できます。
2 人の Google Summer of Code の貢献者がプログラムのコーディング期間を開始しました！
GSOC 参加者にとってこの数週間は刺激的な日々でした。今後の更新情報もご期待ください！
Electron 37 では、カスタムの -electron-corner-smoothing CSS プロパティが導入され、アプリは Apple の macOS デザイン言語に合わせたより滑らかな丸角を作成できるようになりました。 この機能はもともと Electron 36 に搭載されていましたが、もっと注目されるべき機能だと感じました。
| コード | 結果 |
|---|---|
|  |
長方形から四分円の角を削り出す標準の border-radius プロパティとは異なり、 -electron-corner-smoothing は連続した縁を持つ 四角形 状で曲線をスムーズに遷移させます。
0% から 100% までの値を使用して滑らかさを調整したり、system-ui 値を使用してオペレーティングシステムのスタイルに一致させたりできます (macOS では 60%、それ以外の場合は 0%)。
このデザイン強化は、境界線、アウトライン、影にも適用でき、アプリに絶妙な上品さを加えることができます。
Electron のスクワークル実装の詳細については、@clavin の RFC 0012 をご参照ください。 この文書ではその動機と技術的な実装について詳しく説明してあります。
初期デザインは Figma の角スムージングの実装からインスピレーションを得ています。 滑らかな角を求める彼らの探求について詳しくは、"スクワークルを必死に求めて" をご覧ください。
Electron 36.0.0 がリリースされました! これには Chromium 136、V8 13.6、Node 22.14.0 へのアップグレードが含まれています。
Electron チームは、Electron 36.0.0 のリリース発表にワクワクしています! npm install electron@latest から npm でインストールするか、リリースウェブサイト からダウンロードできます。 このリリースの詳細は続きをご覧ください。
何かフィードバックがあれば、Bluesky や Mastodon で共有したり、コミュニティの Discord に参加してみましょう! バグや機能の要望は Electron の Issue トラッカー で報告できます。
Electron 36 では、コンテキストメニューでの作文ツール (スペルと文法)、自動入力、サービスメニュー項目など macOS システムレベルの機能を有効化できます。 これを行うには、WebFrameMain のインスタンスを menu.popup() の frame 引数に渡します。
import { BrowserWindow, Menu, WebFrameMain } from 'electron';
const currentWindow = BrowserWindow.getFocusedWindow();
const focusedFrame = currentWindow.webContents.focusedFrame;
const menu = Menu.buildFromTemplate([{ label: 'Copy', role: 'copy' }]);
menu.popup({
window: currentWindow,
frame: focusedFrame,
});
Electron 35.0.0 がリリースされました! これには Chromium 134.0.6998.44、V8 13.5、Node 22.14.0 へのアップグレードが含まれています。
Electron チームは、Electron 35.0.0 のリリース発表にワクワクしています! npm install electron@latest から npm でインストールするか、リリースウェブサイト からダウンロードできます。 このリリースの詳細は続きをご覧ください。
何かフィードバックがあれば、Bluesky や Mastodon で共有したり、コミュニティの Discord に参加してみましょう! バグや機能の要望は Electron の Issue トラッカー で報告できます。
もともと RFC #8 で @samuelmaddock によって提案されていたもので、Electron 35 にて サービスワーカー にプリロードスクリプトをアタッチする機能を追加します。 Chrome の Manifest V3 拡張機能では多くの機能が 拡張機能のサービスワーカー を通じて提供されるため、この機能は Electron と最新の Chrome 拡張機能との間のサポートに関するギャップを埋めます。
Session のレベルでプログラムでプリロードスクリプトを登録する場合、ses.registerPreloadScript(script) API でそれをサービスワーカーのコンテキストへ指定し適用できるようになりました。
// セッションにプリロードレルムスクリプトを追加します。
session.defaultSession.registerPreloadScript({
// スクリプトはサービスワーカーのプリロードレルムでのみ実行されるべきです。
type: 'service-worker',
// スクリプトへの絶対パス。
script: path.join(__dirname, 'extension-sw-preload.js'),
});
さらに、ServiceWorkerMain.ipc のインスタンスを介して、サービスワーカーとそれにアタッチされたプリロードスクリプトの間で IPC が利用できるようになりました。 プリロードスクリプトは引き続き ipcRenderer モジュールでもサービスワーカーと通信できます。 詳細は元の RFC をご参照ください。
この機能の実装前に、以下の前提となる他多くの変更が行われました。
Electron は Google Summer of Code (GSoC) 2025 のメンター組織として再び採用されました！ Google Summer of Code は、オープンソースソフトウェア開発に新たな貢献者を呼び込むことに重点を置いた国際プログラムです。
詳細については、Google の Summer of Code のホームページ をご覧ください。
Electron は、ウェブ技術を用いたクロスプラットフォームのデスクトップアプリケーションを構築する JavaScript フレームワークです。 Electron フレームワークのコアは Chromium と Node.js で構築されたコンパイル済みバイナリ実行形式であり、主に C++ で書かれています。
Electron のコア リポジトリ以外では、Electron エコシステムをサポートするいくつかのプロジェクトを管理しています：
GSoC 貢献者となって、github.com/electron 傘下の多くのプロジェクトのうちの 1 つで Electron のコア貢献者と共同作業する機会が得られます。
Electron にあまり詳しくない方は、ドキュメント を読んだり、Electron Fiddle のサンプルを試してみることをお勧めします。
Electron アプリの頒布について学びたい方は、以下のようにして Electron Forge 付きのサンプルアプリケーションを作成してみてください。
npm init electron-app@latest my-app
コードに少し慣れたら、Electron の Discord サーバー での会話にご参加ください。
Google Summer of Code に初めて参加する方やオープンソース全般に馴染みがない方は、コミュニティに参加する前に、まず Google の 貢献者ガイド を読むことをお勧めします。
あなたが興味のあるプロジェクトのアイデアに関連するリポジトリを見てみることをお勧めします。 あなたの研究を行う一つの方法は、バグを報告したり、 既存の問題をトリアージしたり、プルリクエストを送信したりすることです。 そうすることはコードベースで実践的な練習をする効果的な方法ですが、提案の提出には必須ではありません。 よく検討された提案は、過去のコントリビューションを参照することなくコードへの理解度を実証できるものである必要があります。
Electronへの貢献を検討されている場合は、提案を提出する前に以下のヒントを参考にしてください。
Electron との共同開発に興味を持てましたか? 最初に、準備されている7つのプロジェクトアイデア案をご覧ください。 リストにあるすべてのアイデアは、提案可能です。
リストにないユニークなアイデアをお持ちの場合には検討いたしましが、提案内容が詳細かつ十分に整理されていることを確認してください。 あまり自信がないのであれば、リストのアイデアに従うことをお勧めします。
応募には以下のものがあるとよいでしょう。
Electronアプリケーションの一部として提出する必要のある項目の詳細なガイドはこちらをご確認ください。 Google Summer of Codeポータルに直接提案を送信する。 Electron チームへ電子メールで送信された提案は、最終提出物とみなされません。
提案に関する詳細なガイダンスについては、こちらの Google Summer of Code 公式の提案作成アドバイス に従うことをお勧めします。
応募開始は 2025 年 3 月 24 日、締め切りは 2025 年 4 月 8 日 です。
📚 GSoC 2024 にて、@piotrpdev は Electron コアドキュメントに API 履歴を追加する作業に取り組みました。 Piotr さんが夏に Electron で取り組んだ内容を確認したい方は、2024 GSoC プログラムのアーカイブ にある彼のレポートをご覧ください。
🔐 GSoC 2022 にて、@aryanshridhar は Electron Fiddle でのコンテキスト隔離の有効化に取り組みました。 Aryan さんが夏に Electron で取り組んだことを確認したい方は、2022 GSoC プログラムのアーカイブ から彼のレポートを閲覧できます。
ブログ記事で取り上げられていない質問や提案の執筆に関するお問い合わせは、summer-of-code@electronjs.org までメールしていただくか、GSoC FAQ をご確認ください。 メールを送る前に、 コントリビューターガイダンスをお読みください。
Electron 34.0.0 がリリースされました! これには Chromium 132.0.6834.83、V8 13.2、Node 20.18.1 へのアップグレードが含まれています。
Electron チームは、Electron 34.0.0 のリリース発表にワクワクしています! npm install electron@latest から npm でインストールするか、リリースウェブサイト からダウンロードできます。 このリリースの詳細は続きをご覧ください。
何かフィードバックがあれば、Bluesky や Mastodon で共有したり、コミュニティの Discord に参加してみましょう! バグや機能の要望は Electron の Issue トラッカー で報告できます。
HTTP 圧縮は、ブラウザがデータを受信する前に、Web サーバーによってデータを圧縮することを可能にします。 最新バージョンの Chromium は Brotli や Zstandard などの新しい圧縮アルゴリウムをサポートしており、テキストファイルに対して gzip などの従来方式よりも優れた性能を発揮します。
カスタム圧縮辞書は Brotli や Zstandard の圧縮効率をさらに向上させます。 詳細は共有辞書についてのChrome for Developers ブログをご覧ください。
@felixrieseberg は #44950 に以下の API を追加し、セッションレベルで共有辞書を管理できるようになりました。
session.getSharedDictionaryUsageInfo()session.getSharedDictionaryInfo(options)session.clearSharedDictionaryCache()session.clearSharedDictionaryCacheForIsolationKey(options)レンダラープロセスが規定の時間以上ハングした場合、Electron の unresponsive イベントが発生します。 @samuelmaddock が #44204 で追加した新しい webFrameMain.collectJavaScriptCallStack() API は、関連する WebFrameMain オブジェクト（webContnets.mainFrame）から JavaScript のコールスタックを収集できるようにします。
この API は、JavaScript イベントが長時間実行され、プロセスがハングした場合にフレームが応答しなくなる原因を特定するのに役立ちます。 詳細はクラッシュレポート API の Web 標準への提唱をご覧ください。
const { app } = require('electron');
app.commandLine.appendSwitch(
'enable-features',
'DocumentPolicyIncludeJSCallStacksInCrashReports',
);
app.on('web-contents-created', (_, webContents) => {
webContents.on('unresponsive', async () => {
// 応答しないレンダラーの実行を中断し、コールスタックを収集する
const callStack = await webContents.mainFrame.collectJavaScriptCallStack();
console.log('Renderer unresponsive\n', callStack);
});
});
[! 注意] このAPIはヘッダーに
'Document-Policy': 'include-js-call-stacks-in-crash-reports'を追加して、有効化する必要があります。 詳しい情報は #45356 を参照してください。