最近はほぼ手付かずになっていますが、GitHub Page上にパズルソルバーを作っています。数ヶ月前に、ビルドをWebpack経由に乗り換えました。

以前の問題点

もともとは、GruntやGulpのように変化し続けるプロセスランナーに嫌気が差して、Browserify+Rakeで組んでいました。Rakeもビルドツールということで、多様なファイルの交錯するJavaScript環境でも問題なく使えたのですが、使っていくに連れて、いくつかの問題に気づきました。

一時ファイルの問題

Rakeが「ファイルをファイルに変換する」というプロセスをベースにしている関係上、最終生成物以外に中間の結果をファイルに置く必要があります。そして、元のファイルを消したときに中間ファイルも消えないと余計なものが残り続けるのですが、ここがどうにもうまくできませんでした。

速度の問題

もともとの思想から言えばそうなるのも必然といえば必然なのですが、1ファイルを処理するために1プロセスを立ち上げる必要があるため、2桁のファイルを処理しようとすれば分単位のビルド時間がかかって、かなりの負担となっていました。

Webpackに乗り換えた結果

Webpackに乗り換える前にCoffeeScriptは捨てていて、ふつうのJavaScriptとRiot.jsだけになっていたので、Webpackにuglifyjs-webpack-pluginとriot-tag-loaderを足して、そしてRiotのタグもJavaScriptに変換してからBrowserifyしていたものをそのまま使うためにresolve.extensionsに.tagも追加するようにしてビルドプロセスを組み立てたところ、ビルドは数秒で片付くようになり、Watchしてのビルドも一瞬で片付くなど、だいぶ気持ちよく処理できるようになりました。

結論

やっぱり、速さは魅力。