やっぱり npm とかエコシステムとかに対する違和感というか
以前も似たようなことを言った気がするけど、フロントエンド界隈は色々と複雑化する一方でつらい。
開発言語を選ぶにしても Babel やら TypeScript やら、トランスパイルする言語それ自体と、Webpack などのビルドツール、それらを組み合わせるプラグインに「軽くしたい」だの「アレをバンドルしたい」だの思う度にツールが増えていく。
色々諦めたりして package.json に書いた dependencies の数を減らしても、その依存パッケージが依存しているパッケージは無数にあり、結局 node-modules/ ディレクトリが数百 MB 〜 1GB 以上に膨れ上がったりする。自分が最終的に作り出す成果物ファイルなんてたかだか数百 KB、よくて数 MB なのに。
色んなライブラリがあって便利。フレームワークが何でもやってくれていて便利。でもそれは「裏で何が行われているか」を分かった上でないと使えない。初学者がノリで RxJS は触れず、昔ながらのコールバック地獄を一度味わってからでないと、やっぱり上手く書けない。
歴史を覚えて、その便利さと使いどころを押さえたとして、パッケージの組み合わせ方と独自の API を覚えるばかりで、その知識はあまり他に役立たない。類似のライブラリでも API は結構異なるし、そんなに流用できない。
とりあえず色んなパッケージを組み合わせて、何か作り上げるけど、出来上がるモノは、生の JavaScript で実装した、手作業で DOM 操作するようなコードと、特段大差ない。豪華なライブラリもフレームワークも、結局はブラウザネイティブの機能にアクセスして何かするためのラッパーと言ってしまえば終わり。addEventListener() に appendChild() なワケだ。
この2年ほどで、僕は jQuery ぐらいしか使ったことなかったところから、AngularJS・Angular・React・Riot・Electron・Cordova・Express などのフレームワーク、Babel・TypeScript・Browserify・Bower・Gulp・Webpack・Jasmine・Karma・Protractor などの各種ツール、Moment.js・Lodash・RxJS などのライブラリを使いこなせるようになった。
でも、作ってきたモノは、別に Angular でないと作れなかったワケでもないし、Gulp や Webpack を使わないといけなかったワケでもない。代替手段がなかったと思うのは、せいぜいスマホアプリ化のための Cordova、デスクトップアプリ化のための Electron あたりの、フロントエンド以外のネイティブコードが大きく絡むミドルウェアぐらい。HTML も CSS も JavaScript も、別に何のライブラリも使わず、生で書ける。生で書いて同等の成果物は作れる。さっきも言ったがブラウザ上で動作する以上、原理的にはそうなはずだ。なんかこう、自分で作った感じがしない。Joel on Software でも言われてたけど、「抽象化は作業時間の節約をするが、学ぶ時間までは節約しない」ってところが引っかかってる感じ。
で、さらに、だ。生の JavaScript でも書けるのに、型が付くからとか、クラス構文だとか、DI できるだとか、何かそういうちょっとした便利さのために、環境構築が大変になったり、アホみたいに膨れ上がった node_modules のメンテナンスをしないといけない。効果がコストに見合っていない感じがする。
いや、確かに便利なんだ。Angular が用意した CLI に則ってクラスを作って、用意されたテスティングツールをすぐ使えて、Lint もできて。そこに Cordova をちょちょっと組み込めばすぐにスマホアプリにもできる。手軽だし、一人で人力でこんなツールを準備するのは大変だ。
でも、なんというか、プロジェクトルートに package.json や .npmrc や tsconfig.json や angular.json や .jsbeautifyrc が転がっている、というのが、未だに慣れない、納得が行かないのだ。毎回似たような、でも少しずつ違う設定をして、環境構築に時間を割いている気がする。
我々はこんなに設定ファイルに囲まれて、色んなモノに依存していないと、ウェブページが作れないのか？今まで「メモ帳」で、手打ちで作っていたのに？HTML すら Haml なんて拡張言語で書かないといけないほど、コーディングを効率しないといけないような、大規模なモノを作っているっけ？
僕がまだまだ大した仕事をしていないだけかもしれない。考え方が20世紀のままの、古臭い Webmonkey なのかもしれない。どうやったらこの違和感を払拭して、「これからのフロントエンド開発はこういうモノなの！設定ファイルに囲まれて Yarn とか Webpack とか言ってましょう！」って振り切れるだろうか。