Electron使いがMuonをHello, worldしてみた
世間(というか渋谷)では本来の趣旨を大きく外したハロウィン騒ぎが盛り上がっている(?)今日この頃。
何でも書くブログについに純粋技術記事のネタが降臨です。
時代はWebベースのデスクトップアプリか?
私は過去にElectron*1というデスクトップアプリフレームワークを使ったアプリ開発の実践技術書を、 技術書典で頒布したことがあります。
次回(技術書典8)あたりでこれの改訂増補版を出そうと進んだり戻ったりしているのですが、 最近「ポストElectron」と言えるかも知れないデスクトップアプリフレームワークがあることをTwitterで知りました。
その名を「Muon」というそれを、Hello, worldして雑感をメモってみることにしました。
電子 vs ミュー粒子
Electronが「電子」だからなのか、それに対抗した(?)「ミュー粒子」*2というネーミングっぽいMuon。 Chromiumの代わりにUltralightというWebKitベースのエンジンを使うことで、 メモリ使用量の削減やファイルサイズの削減を狙ったデスクトップアプリフレームワーク*3です。 ElectronがNode.js(=JavaScript)なのに対し、 MuonはGoで開発されています*4。
GitHubのコミット履歴を追う限りは、できたてホヤホヤの感じがしますね。
なにはともあれ、Hello, worldしてみる
リポジトリに記載のGettingStartedGuideに従って、サンプルプロジェクトを動かしてみます。 なお、実行環境は次の通りです。
$ sw_vers ProductName: Mac OS X ProductVersion: 10.14.6 BuildVersion: 18G103 $ go version go version go1.13.3 darwin/amd64 $ yarn --version 1.17.3
リポジトリをcloneする
手順に従って、リポジトリをcloneします。
$ git clone https://github.com/ImVexed/muon $ cd muon/examples/create-react-app
サンプルプロジェクトはReactで書かれているようです。 なお私はReactはド素人です(今回はゴリゴリ実装するわけじゃないからセーフ)。
Reactのプロジェクトをビルドする
サンプルプロジェクトをMuonで動かすためには、一度ビルドする必要があるようです。 Yarnを使って依存関係を解決して、ビルドまで実行してみます(この辺はReactのプロジェクトをビルドするのと一緒っぽいですね)。
$ cd public/ $ yarn # もしくは、yarn install $ yarn build
Go用にパッケージング・ビルドする
ガイドによると、ここからGoのパッケージャーでパッケージングしなくてはならないと書かれています。
ここがちょっと分かりづらかったのですが、要はfileb0xというパッケージャーを使えるようにしなさい、ということのようです。
手順としてはgo get github.com/UnnoTed/fileb0x
でバイナリをダウンロードし、
ダウンロードされたバイナリがあるディレクトリ*5を環境変数PATH
に設定する、
という2つの手順を行います。
その上でひとつ上のcreate-react-app
ディレクトリに戻り、
$ fileb0x b0x.yml
または
$ go generate
でパッケージング、その後go build
でビルドします。
Ultralightのライブラリを用意する
ここまでで一通りの準備はできているのですが、最後に手動で用意しなくてはならないものがあります。 Chromiumの代わりに使うUltralightのライブラリです。 ガイドには「リンク先からアーカイブをダウンロードして展開、自分でルートディレクトリに配置しなさい」とありますが、 実はリポジトリ内*6にちゃんと用意してあり、 それをそのままコピーして使えばよさそうです(動いたには動いたけどいいのか……?)。
ただしLinuxやMacOSの場合はルートディレクトリに置いただけではダメなようで(ここで長時間罠にはまった)、
環境変数LD_LIBRARY_PATH
にライブラリファイルを配置したパスを設定する必要があります(Windowsはこの設定は不要らしいです)。
動かしてみる
いよいよ動かしてみます。
create-react-app
ディレクトリで、次のコマンドを実行します。
$ go run main.go
上手くいけば、新規ウィンドウが立ち上がってHello, worldに成功します。
気になったこと
事前にビルドしているからか、
run main.go
コマンドで起動したときのウィンドウの立ち上がる早さはElectronで開発しているときと比にならないくらい早いですね。
しかしながら、事前ビルドだとホットリロードできないんじゃ……?という疑問もわいてきます。
一応README.mdには「Hot-reloading」がFeaturesとして挙げられているのですが、いまいちその方法が分かりませんでした。
ホットリロードができないとyarn build
とgo generate
を毎回実行しなくてはならなくなるので、結構面倒です。
また、まだできたてホヤホヤということもあり不具合も多く (ウィンドウサイズを変えようとしたところフリーズしてしまい強制終了する羽目に)、 実用レベルで使うにはハードルが高そうです。 ほとんどはUltralight自身が未対応になっている部分が影響しているらしいので、 ここは時間が解決してくれるのを待つしかなさそうです。
あと、個人的にはReact以外も使えるのかちょっと気になります。Vue.jsとか。
まとめ
現時点では当然Electronの方に軍配が上がるわけですが、 今後未対応機能が対応されるにつれて、Muon自身の一番のウリとも言える「省メモリ」「省ファイルサイズ」が着目されて、 Electronの良きライバルになるかも知れません。 それを期待しながら首を長くして待ってみる、という感じでしょうね。
開発が進んでできることが増えてきたら、JavaScript - Go間の相互運用なども試してみようと思います。
*2:https://ja.wikipedia.org/wiki/%E3%83%9F%E3%83%A5%E3%83%BC%E7%B2%92%E5%AD%90
*3:の割には、質量的にはミュー粒子の方が電子より大きいということはツッコんだら負け?
*4:Goで開発されているとはいいつつも、JavaScriptとの相互運用性をうたってはいるようです
*6:https://github.com/ImVexed/muon/tree/master/ultralight/libs