Electron

Electronアプリの起動時間短縮に挑む

アプリが起動するまでの時間が短いと気持ちいい アプリの起動は最初の一回しか発生しないのに、 その後はアプリは起動しっぱなしなのに、 この最初の起動までの時間が短いと、アプリの使用感が非常に良くなるような気がする。 気がしない? この記事はElectr…

MacのElectronで"safeDialogs"の機能が動作するようになった

要約 動作しないと自分の中で評判だった、 Electronの無限アラート防止機能"safeDialogs"の問題が修正。 Electronバージョン5から動作するようになった。 BrowserWindowのsafeDialogsオプション ElectronのBrowserWindowに、"safeDialogs"というオプションが…

AquesTalkの機能をJavaScriptから呼び出す機能をライブラリに切り出した

概要 Mac用の動画作成用ゆっくりボイスアプリ MYukkuriVoice で使用している AquesTalk呼び出し機能を、ライブラリに切り出した。 たぶんMacで、Electronで、AquesTalkな読み上げアプリを作るなら役に立つでしょう。 めちゃくちゃレアケースだな!!! githu…

Electronのrenderer processで、consoleのログ出力をターミナルに吐かせる

さいしょに Electronアプリの開発中はelectronコマンドで直接アプリを起動すること多いと思う。 electron . この時、main processでconsole.logると、ターミナルにログが出力される。 でも、renderer processでconsole.logしたら、ブラウザ側にログが出力さ…

Electronでネイティブを実行できるnode-ffiを利用できるようになるまで

はじまりはじまり node-ffiというライブラリがある。 これを使うと、ネイティブなライブラリ・フレームワークを JavaScriptのコードから呼び出せる。 https://github.com/node-ffi/node-ffi なのですが、Electronから使う場合、npmでnode-ffiを入れるだけで…

続・Electronの検索ダイアログ

Electronのページ内検索ダイアログのライブラリを作り替えた。 electron-search-dialog https://www.npmjs.com/package/electron-search-dialog すごいシンプルになった 作り替えたら、renderer processのjavascriptから、 このコードを呼ぶと動くようになっ…

ElectronのBrowserWindowを閉じた時に、closeでなく非表示にして、次回の再表示を早くする

ElectronのBrowserWindowのインスタンスを画面表示のたびに作り直すのは重い。 ので、閉じたり開いたりを繰り返す、サブのウィンドウでは、 BrowserWindowを破棄して、再度作るのではなく いったん隠して、必要になったらウィンドウを再表示する ように変え…

Electron用の検索ダイアログ作った

つくった Electronアプリのページ内を検索するダイアログ。 https://www.npmjs.com/package/electron-search-dialog 使うと、こんな感じに検索ウィンドウが表示されて、 Electronのページのテキストを検索できる。 Excelの検索ダイアログに似せてみた。 npm…

Web Audio APIのOfflineAudioContextを使うたびに増えていく、スレッド数とメモリ使用量の調査

経緯 音声を操作するWeb Audio APIという、WebブラウザのAPIがあります。そのAPIの中の、OfflineAudioContextというオブジェクトを、MacのElectron製アプリで利用していたのですが、アプリを動作させながらアクティビティモニタを確認していたら、何かがおか…

MacのElectronアプリに、MacのHelp Bookを組み込む

Macでヘルプで検索した時に起動するアレ。Help Book。 MacでElectronアプリを作るのであれば、 Help Bookにヘルプ機能を作り込めば、よりMacライクなアプリになるのではないか。そう考えてトライしたのであった。 作業手順 1. Help Bookを作る 2. Electronア…

Mac用ゆっくり系ボイス再生アプリMYukkuriVoiceでユーザー辞書機能に対応した

https://github.com/taku-o/myukkurivoice MYukkuriVoiceは、Mac用のゆっくりボイスを再生したり、録音したりする機能のあるアプリです。 ユーザー辞書機能を作ろうとして、 同系統のアプリ、SofTalk、棒読みちゃんでは、自力で文章を字句解析して置き換えて…

マルチなウィンドウのElectronアプリで、メニュー制御する話

Electronのアプリで、ウィンドウ毎に、メニューを切り替えたいとか、 有効無効を切り替えたいことってあると思うんです。 今回はフォーカスが当たっている時だけ、メニューを有効にする方法の話。 メニューアイテムのenabledを切り替える メニューの有効無効…

Electronアプリで、アプリアイコンにドロップされたファイルを処理する

Finder上のアプリアイコンにファイルをドロップされた時、Dock上のアプリアイコンにファイルをドロップされた時、 Electron製のアプリで、そのファイルを受け取って処理する機能の実装方法です。 (Macの話だったり、私製アプリのコードの断片が入ってたり、T…

Electronアプリは、まずelectron-localshortcut入れて、Command+R、Command+Wを潰すのがセオリーだと思う

おまえ、セオリー語れるほど、Electronやってないだろう。 globalShortcut https://electronjs.org/docs/api/global-shortcut Electronにはショートカットキーを制御するglobalShortcutという機能があるんですけど、 これは公式ドキュメントにも書いてあると…

画像をElectron側にキャッシュしておく話

Electronを業務で使っている会社とかあるらしい。 で、自分も活用してみよう。Electronでどんなアプリを作るかって考えたら、 サーバーのデータを参照するElectronアプリも作れるけれど、 でも、それだったら、Webページでも良いわけで、 Electronを使うなら…

Electronの画面にHTML落とすと、画面が切り替わっちゃうよね

Electronで立ち上げたBrowserWindowの画面に、 HTMLファイルを落とすと、 そのHTMLがウィンドウ内に表示されてしまう。 格好悪い!!! これをふせぐには ドロップした時に、画面が差し替わる問題を防ぐには、次のようなコードを入れておくと良い。 <html> <head> <meta charset="UTF-8"> <script type="text/javascript"> doc</meta></head></html>…

Electronのアプリが落ちたり、画面がまっしろになっってしまった時の、問題の追い方

Electronアプリでのエラーの追い方。 アプリが起動もしないで落ちる時 アプリをクリックして起動したら、そのまま落ちる時。 最初に追うのは main processの初期化まわりで問題が起きていないか。 electron-logを入れて、ログ出力するのが良いと思う。 elect…

electron-json-storage、electron-storeを使ったElectronアプリのテストの話

経緯とか Electronでよく使われる(?)設定ファイル読込系ライブラリに electron-json-storage (https://github.com/electron-userland/electron-json-storage) electron-store (旧 electron-config) (https://github.com/sindresorhus/electron-store) がある…

Electron製のアプリの見た目をMacふうのアプリにする electron-photonの話

最近、社内でLT(https://labs.gree.jp/blog/2018/10/17291/)があって、そこで話をしたので、その時の内容を書く。 これは、その一部の話。 photonkit Electronアプリの見た目をMacアプリふうにする、photonkitというライブラリがかつてありました。 http://p…

Electron製のアプリの起動を速くするelectron-linkの話

最近、社内でLT(https://labs.gree.jp/blog/2018/10/17291/)があって、そこで話をしたので、その時の内容を書く。 これは、その一部の話。 経緯とか どうにかして、アプリを速くできないかなー、って情報探してたら Atomというエディタの起動時間を高速化し…

ElectronのBrowserWindow間で直接メッセージをやりとりする

最近、社内でLT(https://labs.gree.jp/blog/2018/10/17291/)があって、そこで話をしたので、その時の内容を書く。 これは、その一部の話。 経緯とか要約とか 複数立ち上げたBrowserWindowのインスタンス間でメッセージをやりとりする。 社内のメモで出来ない…

Electron Fiddle

最近、社内でLT(https://labs.gree.jp/blog/2018/10/17291/)があって、そこで話をしたので、その時の内容を書く。 これは、その一部のElectron Fiddleの話。 Electron Fiddle https://github.com/electron/fiddle Electronコードの挙動を簡易に確認できるア…

electron-packagerのignoreオプションが余計なファイルを巻き込みすぎるのを何とかした

Electronのアプリを作成するelectron-packagerコマンドでは、 ignoreオプションでアプリに含めたくないファイルを除外できる。 最初のバージョン 最初はこのような感じでelectron-packagerコマンドを実行していた。 electron-packager . MYukkuriVoice --pla…

Electronアプリから、別のアプリへファイルのドラッグアンドドロップによる受け渡しを実現する

経緯 Electronのアプリで音声ファイルを生成したら、その音声ファイルを直接、動画編集ソフトにドロップしたかった。 これが出来ると、音声録音→動画編集ソフトに突っ込み、の作業をポイポイできるようになる。 ファーストトライ 駄目だったパターン。これ(↓…

古いバージョンのElectronで作られたアプリのElectronライブラリを更新する

Electron製アプリのElectronのバージョンがだいぶ古くなったので更新してみる。 https://github.com/taku-o/myukkurivoice Electronのバージョンを上げても、特に機能が増えたりしないのがツライところだが。 後になるほど、更新作業の量が増えたり、インタ…

Web Audio APIで作ったaudio/wav形式の音声を保存する

この(↓)のアプリを作っている間に得た知見 https://github.com/taku-o/myukkurivoice Web Audio APIで作った音声を保存する方法は、調べると色々出てくるのですが、 Recorder.js MediaStream Recording API ScriptProcessorNode この記事では、自分にはこれ…

Mac Sierraでも動作するAquesTalkの音声再生アプリMYukkuriVoiceを作った

アプリの説明は動画の中で説明しているので、この記事では、このアプリを作った時に得られた (役に立たない部分が多そうな)知見について話そうと思う。 https://github.com/taku-o/myukkurivoice Macのゆっくり事情 いわゆるゆっくりの声はAquesTalkというラ…