「NW.js（node-webkit）」と「Electron」の違いと感想

no link

2016年01月25日 13:22:43

　ここ数年、「NW.js（旧node-webkit）」を触ってきました。

　そして、先週の金曜日の夜から、今週の朝にかけて「Electron」で、ブログ更新用ソフトを作りました。

　というわけで感想です。

● 方向性がだいぶ違う

「NW.js」も「Electron」も、「node.js」＋「WebKit」なのですが、方向性が大きく違うと感じました。

「NW.js」は、既存のウェブアプリに「node.js」の機能を追加した印象です。

「Electron」は、「node.js」のプログラムから「WebKit」を呼び出したものです。

　そういった違いが、色濃く表れるのは、複数ウィンドウを使う場合です。

「NW.js」だと、ウィンドウから、ウィンドウを呼び出すことになり、「最初のウィンドウを閉じたらどうなるの？」→「実行は続く」という、直感的ではない状態になります。

　それに、aタグのtarget="_blank"で、新しいウィンドウを開くと、途端に「あれ、どうなっているの？」となります。

　これは、地味にイラッときます。というか、大きなアプリを作るのには筋が悪いと感じます。実際に、規模が大きくなってくると、「向いていないな」と感想を持つようになりました。

「NW.js」で作れるのは、1ページで完結するアプリまでだなあと。

　対して、「Electron」では、ウィンドウ管理が、直感に従っています。

　「Electron」では、メインプロセス（node.jsのプロセス）とレンダープロセス（ブラウザのプロセス）に分かれています。

　このメインプロセスから、「BrowserWindow.getAllWindows()」することで、開いている全てのウィンドウを取得して管理できます。

　また、「app.on('window-all-closed', function() {})」で、全てのウィンドウの終了を検出したり、「app.on('browser-window-created', function() {})」で、新しいウィンドウが開いたのを検出したりできます。

　そして、プロセス間は、IPC（inter-process communication：プロセス間通信）でやり取りすることになります。

　これは堅牢な設計だと感じさせられます。その分、コード量が増えますが。

● ウェブアプリの移植

「node.js」＋「WebKit」を使いたい用途の1つは、既存のウェブアプリの、ローカルアプリへの移植だと思います。

　これは、「NW.js」の方が圧倒的に簡単です。「Electron」だと、メインプロセス周りを追加して作らないといけないので、無駄が多いです。

　あと「Electron」は、「jQuery」がそのままでは動きません。scriptタグに書いていた「jQuery」はエラーが出るため、「Electron」用に書き換える必要があります。以下のような感じに。

window.jQuery = window.$ = require("./lib/jquery.min.js");

　そのため、移植に一手間かかります。「NW.js」だと、コピペで終わるのですが、少しだけ面倒です。

● 終わりに

「NW.js」は、冒険家が十徳ナイフで、ザクザクとウェブアプリをローカル化する感じで、「Electron」は、建築家が設計図を引いて、建物を作っていく感じです。

「NW.js」は、簡単だけど、複雑なことをするのには向いていない。

「Electron」は、面倒だけど、きっちりとしたものを作りやすい。

　そういった方向性の違いがあります。

　個人的な感想としては、以下のような感じです。

「NW.js」→ウェブアプリから、ローカルアプリへの移植に向いている。

「Electron」→JavaScriptを使い、1からローカルアプリを作るのに向いている。

　そういった感じです。

1つ前の記事：「highlight.js」の導入

1つ後の記事：テスト投稿