青竹雑記帖(6代目)

テキスト処理をメインとしたIT解説をします。

JavaScriptフレームワーク(泣)

はじめに:敗北

私の本業は情報系の大学院生(博士課程)です。また、アルバイトとしてとある通販会社の内製システム改修業務を担当しています。本業ではテキストデータを刻んで機械学習や統計処理にかけているため、CLI一辺倒でガチャガチャやっていますが、アルバイトではウェブシステムを取り扱っているため、フロントエンドの知識も必要になってきます。

アルバイト先のシステムはそこそこ年季が入っていて、改修が重ねられた結果、現在はバックエンドとフロントエンドが一定程度分離された状態となっています。分離された部分のフロントエンドには Vue.js と Vuex が用いられています。すでにバックエンドとフロントエンドをともに扱う機能追加改修をひとつ成し遂げており、これで Vue を完全に理解したぞワハハハハ(←フラグ)として次のフロントエンド部分機能改修タスクに取り掛かり、昨日盛大に挫折しました。なんなんだ、 Vue というか Vuex が全くわからんぞ……

Vuex わからん

developer.mozilla.org

世の中にはJavaScriptフレームワークが複数あります。その中でも、現在広く使われていて、活発なコミュニティ活動と優れたドキュメントがある代表的なフレームワークが MDN Web Docs で紹介されています。 Vue はその中のひとつにあたり、学習コストが非常に低く、それでいて多様なアプリケーションの開発が容易になることが特徴です。確かに、使いやすいなと思ってちまちまと遊び、アルバイト先の小規模システム構築にも利用しました。その経験を踏まえて内製システムの改修に臨み、1勝1敗となっています。その原因が Vuex です。

Vuex とは、「Vue.js アプリケーションのための 状態管理パターン + ライブラリ*1」です。まず私はフロントエンドにおける「状態管理」の意義と実際について理解が不足しているため、その部分の理解を深める必要があります。とはいえ「理解するまで1か月時間を寄越せ」と言える立場ではない(正確には堂々と宣言できなくもありませんが、あまり期限を遅らせるようでは良心がない)ので、ひとまず重要な部分を理解して、他の実装済のコードを参照しつつコードを実装するわけですが、全く動きません。トホホ。システム班のチーフと議論した結果、本質的な問題はこのシステムにドキュメントが存在せず、何を思ってこのような実装にしているのかという「設計哲学」がまったく分からないことが、コード理解を困難にしているという結論に至りました。こんなもん改修できるかと投げてもいいですし、実はすでに新システムの開発も進んでいるのでなおさら投げてもいいわけですが、それでは良心がない(2回目)ので、やります。

JavaScriptフレームワークなんかきらいだーーーーーーーーーーーーっ!(←ドップラー効果で遠ざかる声)

私は JavaScript 自体を粉砕したくてたまりませんが、これ無くして現代のリッチなウェブ体験が存在し得ないことを理解しています。実際、自分でも扱えないと現代を生きるのは難しいので、いわゆる「生の」 JavaScript を学び、扱えるようになっています。ではそこからフレームワークの学習に進んでみよう! ……となっていないのが現状です。 Vue.js は扱えますけど、正直、それを頼みに積極的に開発案件を受けようとは思いません。いっちょん好かん(ぎこちない共通語訳:全く好きではない)。

フレームワーク抜きで戦うには

好きでなければフレームワーク抜きで戦う必要がありますが、自分だけの小規模プロダクトであれば生のJavaScriptで戦うことは余裕です。でも、チーム開発や大規模プロダクトになると、フレームワーク抜きだと間違いなく破綻します。どら焼き1個賭けてもいいです。お仕事をするみなさんと未来の私頑張ってください。

でも、フレームワークがすべて爆発四散した荒涼たる未来インターネットの世界でも生き残りたいあなたには、生のJavaScriptだけでいろいろやってみる訓練をするのも良い経験だと思います。Ajaxも書きやすくなりましたし。第一歩はみんなだいすき MDN Web Docs から!

developer.mozilla.org

フレームワーク抜きで戦う思想の根源

私がフレームワーク抜きでもなんとか戦おうと思うようになったきっかけとなる思想書は、「Windows/Mac/UNIX すべてで20年動くプログラムはどう書くべきか」(松浦智之著、USP研究所監修)です。これ自身はシェルスクリプトを用いた兵法書ですが、その中にフレームワークに頼らないインターネットとの付き合い方(プログラム作成法)の例として「生のJavaScript機能でも戦えるぞ」というコード例があって、大いに感銘を受けた次第です。この当時は XMLHttpRequest を用いて Ajax を実装していましたが、今であれば Fetch API を利用しても問題ないでしょう。

この書にある「POSIX原理主義」「POSIX中心主義(POSIX原理主義 + W3C原理主義)」の思想は賛否両論ありますが、それを採用するにせよ採用しないにせよ、触れておくと技術を扱う上で得られるものが多いと確信しています。少々お高めの一品ですがぜひご一読ください。フレームワーク無しでもかなり戦えることを知り、また、フレームワークがあると便利になる部分を理解する助けになります。