デスクトップアプリへの挑戦

きっかけ

クラウドソーシングで何か軸になるサービスを持ちたいと思ったばかりだ。

候補としてPythonでTKinterとかC#でXamarinでもええかと思ったけれどもユーザー側で言語環境を作る必要がなくスタンドアローンで使えるか、現状のweb知識やら資源を活用できるもの、某リンゴ社製品を持っていないという点からweb色の強いnode.jsでやってみようと手を付けた。Electron.jsとNW.jsを比較して比較的に情報量の少ないNW.jsをチョイスした(謎)。jsの経験としてはDOM操作くらいしかなく『魔界』のイメージしかもっていない。

感触

とりあえず外部ソースを取得できるかの検証を踏まえてのテストコードを実行するアプリを作ってみた。Chromium自体は軽快に動いてくれるけどもビルドしたソースのサイズがアホほどでかくしょっぱいhtmlと数行のjsコードで300MBを軽く超えてきた。デスクトップアプリなのでまぁええかと開き直っておく。

ロジックを考えてどんなAPIが必要か、どんな制限を受けるかの境界が見えないのでjs自体の幅を広げる必要があるかと感じた。

記録

バージョン

$ node -v

v13.12.0

$ npm -v

6.14.4

NW.jsとNW-Builderのインストールまで

mkdir nwtest

cd nwtest

npm init

mkdir src

cd src

npm init

cd ../

npm install nw --nwjs_build_type=sdk --save-dev

npm install nw-builder --save-dev

この時点のディレクトリ構成

nwtest

+ node_module

+ src

	+ index.html

	+ package.json

+ package-lock.json

+ package.json

package.jsonの中身

/* /nwtest/package.json */

{

  "name": "nwtest",

  "version": "1.0.0",

  "description": "nwtest",

  "main": "./src/index.html",

  "scripts": {

	"test": "echo \"Error: no test specified\" && exit 1",

	"build": "nwbuild -p linux64 src",

	"start": "nw ./src"

  },

  "author": "",

  "license": "ISC",

  "dependencies": {},

  "devDependencies": {

	"nw": "^0.44.6",

	"nw-builder": "^3.5.7"

  }

}

/* /nwtest/src/package.json */

{

  "name": "nwsrc",

  "version": "1.0.0",

  "description": "",

  "main": "index.html",

  "scripts": {

	"test": "echo \"Error: no test specified\" && exit 1"

  },

  "author": "",

  "license": "ISC"

}

nwtestフォルダ直下のpackage.jsonのscriptsに"build"と"start"のコマンドを登録しておく。あとはindex.htmlにコードを書いて"npm start"でテストしてアプリ化する際に"npm run build"するだけ。

Electronもやってみた

環境作るのが楽だったがブラウザを使うと言うよりかはブラウザにイベントベースのコードを木の根のように無限に生やしていくような感触で気持ち悪かった。ただビルドがめっちゃ早い。ファイルサイズはnw.jsのだいたい半分くらい。