Gaiax Engineers' Blog

Gaiaxのエンジニアブログです。 社内のエンジニア様子、イベントレポート等を発信していきます。

意外と知らない? JavaScript トレンド 2015

Gaiax Advent Calendar 2015 18日目担当の @hoto17296 です。

昨今の JavaScript は状況がめまぐるしく変化していて、それほど関心がない人にとっては追随するだけでも一苦労なのではないでしょうか。そこで今回は最近の JavaScript がわからない人向けに「昨今の JavaScript トレンド」について書きます。

トレンドっぽいキーワード一覧

ひとまずパっと思いつくキーワードを列挙してみます。

こうやって書き出してみるとけっこうたくさんありますね。 これでもまだ僕の観測範囲だけなので他にもまだまだあると思います。

で、結局何をやればいいの

完全に僕の主観で「そろそろデファクトとして定着した気がするもの」「やっておいて損はないと思うもの」をいくつか紹介します。

Node.js

JavaScript のサーバーサイド実行環境である Node.js ですが、9月に io.js とマージされて v4.0 がリリースされたのもつかの間、10月には LTS (長期サポート) である v4.2 がリリースされました。これによって「必ず30ヶ月はサポートされる」という安心感のもとで Node.js を導入することができるようになりました。

Node.js のリリースサイクルについては yosuke_furukawa さんの以下のエントリが詳しいです。

yosuke-furukawa.hatenablog.com

ES2015 & Babel

babeljs.io

ES2015 (ECMAScript 2015) は次期 JavaScript の仕様です(少し前まで ES6 と呼ばれていました)。かなり多くの機能が追加されてとても便利で強力な言語になっています。

「次期仕様」というと「一部のすごい人だけが触るもの」と思う人がいるかもしれませんが、そんなことはありません。ES2015 の機能の多くは Babel というツールを使って ES5 の JavaScript に変換することができます。「ES5 に変換できる」という安心感があるため、次期仕様を先取りするハードルがかなり低くなっています。

Gulp

gulp.js - the streaming build system

スクランナーです。JavaScript 版の make コマンドみたいなものです。 ES2015 で書かれた js ファイルを Babel で変換するタスクを書いたり、Sass を CSS にビルドするタスクを書いたり、その他にもあらゆるファイルの変換や移動を行うタスクを定義することができます。

昔はタスクランナーといえば Grunt というツールが主流でしたが、今はだいたい Gulp が使われます。最近もまた Fly という新しいタスクランナーが登場しましたが、個人的には Stream ベースである Gulp はまだまだ衰えない強力なタスクランナーだと思っています。

Browserify / Webpack

CommonJS スタイルの require を、ブラウザで動かす JavaScript でも使えるようにするツールとして Browserify と Webpack のふたつが人気です。これらはかなり異なる特徴を持っていますが、用途や好みによって使い分けるといいと思います。

これらのツールは js ファイルをいい感じに分割して開発できるようにするだけではなく、 npm の資産をブラウザ上でも活用することを可能にしたという点で素晴らしいツールです。

Virtual DOM

facebook.github.io

React で一躍話題になった Virtual DOM ですが、React 以外にも RiotMithril という別の実装がありますし、Angular2 でも Virtual DOM が搭載される見込みです。

今までの Web ビューはブラウザの API を通して DOM の状態を取得したり変更を加えたりしなければなりませんでしたが、Virtual DOM によって「(今まで DOM が持っていた)状態はすべてプリミティブな JS オブジェクトとして表現できる」という世界観が創られ、さらにそこに Flux というデータフローの制約を加える事によってフロントエンドに秩序がもたらされるようになりました。

React がこれからも人気であり続けるかは不明ですが、Virtual DOM に端を発するこのコンポーネント指向の流れはおそらくまだまだ廃れないので、何かしらの Virtual DOM に触れてみることは決して損ではないと思います。

まとめ

今の JavaScript 界隈は変化が激しいですが、先行仕様や新しい概念に手を出すハードルは比較的低く、手軽に未来を感じることができて楽しいです。普段あまり JavaScript を書かないという方もぜひ触ってみていただきたいです。