Gotanda.js#12のLT資料です

1. worker_threadsを使っ
た実装の勘所
2019/07/26
Gotanda.js #12

2. • 五反田の会計ソフトの会社で開発本部長をしています
• かつてはフロントエンドを書くなどしていました
• 最近は子供にスマートフォン触らせていたらポケモンGo
のポケモンたちをオーキド博士に送られ全てアメになっ
ていたため、今さら艦これを始めるなどしています

3. worker_threads
• Node.jsでマルチスレッド処理を可能にするモジュール
• イベントループでもなく、マルチプロセスでもなく、
libuvを使った本物のスレッド！
• Node.js v10.5 でexperimentalな機能として導入
• Node.js v11.7.0 で正式に取り込まれた

4. worker_threads
• これは・・WebWorker・・？ってくらい似てます
• Workerのコンストラクタに共有メモリに載せるデータを
指定できる

5. worker_threads
• マルチスレッドなのでI/Oがきつい箇所よりCPU負荷がき
つい箇所で使いたい
• これはどう考えてもトランスパイル
• ということで試してみた

6. worker-thread-loader
• https://github.com/waka/worker-thread-loader
• sampleつけてるので軽く動かしたりできます
• 名前の通りwebpackのloaderをworker-threadsで並列処理
• 大量のJSファイルをマルチスレッドでトランスパイルして高速化した
い

7. モチベーション
• 会社のプロダクトのJSがあまりにもデカい
• node_modules除いて4023ファイル
• node_modules除いて453880行
• webpackのエントリポイントが157
• webpackの設定は結構チューニングしてきたけどビルドが遅
い（= 2分）
• あまりworker-threadsを使ったプログラミング事例がなかった
のでやってみたくなった
• microjobとかthread-poolといったnpmモジュールはあったり
はする

8. webpack loaderとは
• 本題ではないので、
手前味噌ですが、
こういう記事でloader
の話を書いてたりする
ので省きます

9. メインフロー
• メインプロセスとスレッドはonとpostMessageで通信
• スレッドにトランスパイルをお願い
• トランスパイルされたコードをwebpackに戻す

10. スレッドライフサイク
ル
• スレッドを使いまわせる
ような状態遷移が必要
• すべて終わったかをチェック
しないといけないのでDead
ステータスを持たせる
• 結構プリミティブな実装を
していかないといけない

11. わかったこと
• スレッド（Worker）の生成コストが大きい
• 同時起動できるスレッド数は結構少ない
• 4コアのThinkPad X1 carbonだと10スレッド以上だと
サチる
• この辺は処理によっても変わるので調整できるよ
うにするのが大事
• 作ったスレッドを使いまわせるような設計大事
• スレッドプール
• スレッド内で再走可能に

12. わかったこと2
• 果たしてworker-threadsによる並列トランスパイルでビルドは早くなるのか
• 答え「かなり大規模以上なら使える」
• 6000ファイルのトランスパイル
• 2minutes => 1.2minutesくらいに
• テスト書いて実際に入れてみたいと思っている
• 処理を行う環境によって最適なスレッド数を探す必要はある
• 開発環境/CI環境
• ビルドの遅さ > スレッド生成処理の遅さであれば検討
• ex) 最近ビルド遅いしHappyPack使おうかな
• ex) 最近ビルド遅いし独自ローダー作ろうかな
• 同じような話だとテスト実行とかもワンチャンある（かもしれない）