00:04
こんにちは、アプリケーションエンジニアのなおしむです。
今日は、ちょっと面白いウェブサイトを見つけたので、それを見ながら話してみようかなと。
見つけたサイトっていうのが、タイトルが【Angular React Vueの3大フレームワークに集約】
【ICSの代表が教えるフロントエンド技術のトレンド、ログミーテック】というものです。
この記事は、ICSの代表している池田康信さんが書いた記事で、結論としては、ウェブの劇的な変化はなくなってきたよという記事です。
今まで、すごいいろんなライブラリーが乱立して、どれを使えばいいかわからないみたいな時代があったと思うんですけれども、
その変化っていうのが少なくなってきたんじゃないかというような記事です。
この記事の面白いなと思ったところは、この結論の変化が少なくなってきたというところよりも、
この10年間、JS界隈がどんな変化をたどってきたのかっていうところを振り返りながら、この結論に至るというところが面白いなと思います。
今日はこの記事の中に、10年間の線表みたいな年表があるので、その表を見ながら、私もちょっと喋ってみようかなと思います。
最初にいくつかのカテゴリーに分かれて、この10年間が書かれています。
上から行くと、1つ目がJSのライブラリー、フレームワークですかね。
ライブラリーと、次がビルドシステム。
1つ目がオルトJS、4つ目が表現系ライブラリー、描画ライブラリーですね。
この4つを中心に、まずはどんな10年間だったのかっていうのが振り返っています。
最初にJSライブラリーなんですけれども、最初はJSライブラリー、フレームワークなんですけれども、
2010年のあたりには、アンギュラーもありましたけれども、
他にもバックボーンJSとかノックアウトJSとか、そういういろんなフレームワークが乱立している状態が、
この2010年から2015年ぐらいの間に起きました。
なんとなくこの2,3年というところは、3つのライブラリーに集約されてきたというところです。
その3つっていうのは、アンギュラージェースとビュージェースとリアクト。
この3つになってきているかなと。
これはそうかなっていう感じがしますね。
私もずっとビュージェース使ってますけれども、すごく安定していて、
とりあえずこれ使えばサイト作れるかなっていう感じがするので、
あんまり他のが出てきても、なかなかそっちにはいかない感じがしています。
03:00
確かにライブラリーはこの3つになってきて、それはそれで安定してきているので、
このままいきそうだなっていう予想はその通りだなと思うんですけど、
やっぱりJS好きな人としては、あんまり固まってほしくないなっていう感じがしていて、
もっともっと波乱が起きてほしいなっていうところが正直なところです。
いろんなライブラリー使ってみて、それぞれの向き不向きがあって、
面白いなっていうのがJSと触っていて、一番感じるところなので、
あんまり個人的には硬直していく、固着してほしくないなと。
これをじゃあどうやって壊すかっていうと、
これから来るかなと思うのは、来てほしいなと思うのは、
WebAssemblyかなと思う。
WebAssemblyって何かっていうと、すごく雑な言い方をすると、
今はブラウザー上で動く言語といえばJavaScriptしかないんですけれども、
WebAssemblyを介することで、他の言語でもブラウザ上でプログラムを動かすことができるようになります。
具体的にはラストであったり、語言語であったり、
何でも自分の好きな言語で動かすことができます。
これが入ってくると、何でもありな世界になっていくので、
そこで何かライブラリーを1個作られて、それなりに使えるぞってなると、
本当に他の言語の強い人たちがもっと、
これはブラウザで動くライブラリーを作るぞみたいなことで参入してきてくれると、
面白い世界になるかなと思います。
全然わかんないですけど。
ただここからちょっと妄想なんですけれども、
今までJSのライブラリーが乱立してきて、
何となくいくつかに固まりそうだなっていう流れもあるところに、
全然今までと考え方の違うWebAssemblyが入ってくるっていうのは、
何となく知ってる人がどれくらいいるかわかんないですけど、
ゲームオブスローンズみたいで面白いなと思って。
ゲームオブスローンズはネタバレのない範囲内で話すと、
すごくいくつかの国々が自分の領地を広げるために、
いろんな形で戦いを繰り広げてるんですけれども、
その人間同士の戦いだけじゃなくて、
後半になるとゾンビみたいなのも出てきて、
結局はそのゾンビ対人間っていう構図も現れて、
いろんな戦いが繰り広げられるっていうところなんですね。
そのゾンビと戦うには、今まで敵同士だった国々が、
06:04
ちょっと一瞬、戦いやめてゾンビに集中しようみたいな話もあったりして、
逆にそのゾンビを倒したら、
今度どうなるんだみたいなところもありつつ、
何が起きるかわからないみたいな展開が面白いドラマです。
ゲームオブスローンズの場合は、
最終的にゾンビを倒せるんですけども、
最後倒すシーンっていうのはめちゃくちゃかっこいいので、
今回もウェブアセンブリーを倒すシーンみたいなのは、
かっこいい感じになったら面白いかなと思って妄想してます。
よくわかんないので次いきます。
次にビルドシステムについてなんですけれども、
10年までいかないですね。
7、8年前ぐらいにグラントっていうのが出てきて、
それがグラップっていうのに変わったというか、
遷移していったという経緯があって、
最近はウェブパックが出てきていて、
だいたいウェブパック一興だよねっていう話かなと思います。
やっぱりなんでグラントがダメだったかというと、
ダメというか衰退してしまったかというと、
このビルドシステムの界隈については、
まずそもそも昔はJSをHTMLの中で読み込めばOKだったのが、
もうちょっと複数のライブラリを使うようになって、
読み込みの速度を上げるためにミンファイ化したいとか、
いろんなことを考える人が増えた結果、
一回そのままJSを置くのではなくて、
一回なんか処理をかませて置きたい。
それのことをバンドルするって言うんですけど、
バンドルをしたいなという需要が増えたっていうのがきっかけかなと思います。
グラントっていうのは、
JSON形式のデータの中に、
どんな風なセッティングをするのかっていうのを書き込んでいって、
最終的にビルドってやると何か出力されるというようなものです。
もちろんこのグラントっていうのもすごく良かったんですけれども、
JSONに書き込んでいくっていうスタイルだと、
なかなか自由度的に厳しいっていうのがあって、
そこで出てきたのがWebpackかなと思います。
WebpackはJSONではなくてJSで書くので、
JSなので自由自在プログラミングができるという風なものになっています。
今すごくみんなやりたいことが多種多様になっているってこともあって、
Webpack一興っていう状況になっているかなと。
NPMのトレンズを見ると、
圧倒的にWebpackが伸びているということになっています。
私は正直Webpack使っていなくて、
09:03
このNPMトレンズの中に一番下に細々とグラフが出ている
パーセルバンドラーっていうのがあって、
私はこれをいつも使っています。
パーセルバンドラーって何かっていうと、
そもそも設定ファイルっていうものがないバンドラーです。
やりたいことがある程度いつも通りみたいに決まっている場合は、
このライブラリを使うと、
何かわかんないんですけれども、
いい感じにTypeScriptをJSに変換して、
Minify化して、
ディレクトリに置いてくれるっていうのを、
もう完全に自動的にやってくれるツールです。
もちろん設定ファイルがないってことは、
なかなか細かい設定が難しいっていうデメリットはあるんですけれども、
基本やることって言ったら、
本当にTypeScriptをビルドして、
結果としてMinify化しておくぐらいしかないので、
私はこのパーセルバンドラーで十分かなと思って使っています。
このパーセルバンドラーのいいところは、
もしもこの先ちょっと細かいところのセッティングをしたいなと思ったら、
簡単にWebpackに移行できるっていうところ。
設定ファイルがとにかく何もないので、
簡単に他のライブラリに移行することができます。
なので個人的には、もちろんWebpackが細かいことをやるには一番いいと思うんですけれども、
その前にパーセルバンドラーを使ってみて、
まずはそこでさっさとものを作ってみるってことをした方が、
個人的にはいいかなと思っています。
なのでパーセルバンドラーにもうちょっとグラフ的には上がってほしいなと個人的には思っています。
ということで、ちょっと時間が経ってしまったので、
一旦ここで切ろうかなと思います。
残りはalt.jsと表現系ライブラリのところです。
alt.jsもいろんな繊維があって面白いので、また次回その話をしようと思います。
今日は一旦ここで終わろうと思います。
ご視聴ありがとうございました。
それではまた。
