ECMAScript6を使うのは5年ぐらい時期尚早だった

新製品のWEB UIを作ることになりました。

functionって書くのダルいから、CoffeeScriptにしましょうよ」
「でもCoffeeScriptって、そろそろオワコンじゃないか?」
「ちょっと待てよ、そろそろES6(ECMAScript6、JavaScriptの次期標準、後述)が使えるようになってるんじゃないか!?」

そう思ってES6を調べましたが、やっぱりCoffeeScriptを使うべきだという結論に達しました。

CoffeeScriptとES6のおさらい

CoffeeScriptはいわゆるAltJS

長所

  • functionの代わりに->」「ローカル変数にvarが不要」といったイケてる文法が使えます。
  • 事前にJavaScriptコンパイルして使う。*1
  • Ruby on Railsが対応しているなど、かなり普及しているようです。

短所

  • 事前コンパイルが必要なので製品のビルド手順が増える
  • ツール類の使用に少し不安があります。
  • オワコン?(最近のAltJSは静的型がメインらしい)

ES6(ECMAScript6)は、JavaScriptの新しい標準

  • AltJSから構文(->等)を大量に取り込んでいる
  • CoffeeScriptには無い機能(ジェネレータ、let文など)も
  • (当然)ブラウザが直接提供する
    • デバッガなどは、きっとES6をサポートする
    • 廃れない
  • google/traceur-compilerを使って、ES5(現行JavaScript)にコンパイルできる

ES6の対応状況

各ブラウザの対応状況です。

f:id:doloopwhile:20140910133453p:plain

まだ未サポートが多いようです。

予想通りというか、IEの対応が遅れています。IE11すらarrow functionをサポートしていません。比較的進んでいるFirefoxChromeもクラス等の重要機能をサポートしていません。また、Traceur compilerも、全機能をサポートしているわけではないようです。

IEのサポート期限

IEで重要なのは、たとえ新しいIE12がES6をサポートしても、 (arrow functionが無い)IE11をサポートし続けなくてはならないことです。

では、IE11はいつまでサポートする必要があるのでしょう?

  • IEへのサポートは、OSへのサポートとセットで提供される
  • そのOS上で動く一番新しいIEへのサポートだけが提供される(Win7上ではIE11だけをサポート、IE10以下はサポートしない)
  • 従って、IEのサポート期限 = そのIEが最新であるWindowsのサポート期限

以下の表は現状のまとめです。なお、ここではデスクトップ版のWindowsだけを考えています。

Internet Explorer そのIEが最新であるWindows メインストリーム サポート終了 延長サポート終了
Internet Explorer 9 Windows Vista 2012 年 4 月 10 日 2017 年 4 月 11 日
Internet Explorer 10なし
Internet Explorer 11 Windows 7 2015 年 1 月 13 日 2020 年 1 月 14 日
Windows 8.1 2018 年 1 月 9 日 2023 年 1 月 10 日

Windows 7にはIE11が提供されているので、IE10は既にサポートされていない。

正確には以下を参照してください - Stay up-to-date with Internet Explorer - IEBlog - Site Home - MSDN Blogs - Windows ライフサイクルのファクト シート - Windows ヘルプ

IE12がWindows 7 / 8.1の両方にリリースされた場合、IE11のサポートはすぐ打ち切られます。 また、IE12がWindows 8.1のみ提供(7には提供されない)の場合は2020年まで、 Windows 9にしか提供されない場合は2023年まで、IE11のサポートが続く可能性があります。

ES6を使うべき?

うちの場合

CoffeeScriptを使うことにしました。

ES6は他のブラウザも実装が不完全な上、IE11を一定期間サポートしなければならないので、 ES6の機能を本格的に使うのは当分先になりそうです。

一方、CoffeeScriptは今でも完全に動作します。

また、CoffeeScriptツールのサポートが不安だと書きましたが、 各エディタはシンタックスハイライトを提供していますし、 SourceMapを使ってブラウザでデバッグすることもできます。

流行ってないという点も「枯れている」と肯定的に見ることもできます。 仮に廃れたとしても、習得は用意ですし、JavaScriptに戻ることもできます。 CoffeeScriptはまぁまぁ妥当な選択だと思います。

別の判断

A. IEはサポートしない! 普通はナシですよね

B. Firefox/ChromeではネイティブES6・IEではTraceurで生成したES5を使うFirefoxでは動くのにTraceur compilerのバグでIEでは動かない」とか、 逆に「TraceurでES6の新文法を使ったら、Firefoxでは未サポートなので動かない」といったケースが出てきそうです。 ネイティブES6と生成したES5の両方に対してテストを行う必要があるでしょう。

C. 全ブラウザでTraceuerで生成したES5を使う 他のAltJSと同じ開発フローになります。 一番安定性は高そうですが「ブラウザがネイティブでサポートしている」という機能は活かせません。

D. ES5を使い続ける

E. 他のAltJSを使う

IE12マダー?

*1:ブラウザで直接動かす方法もありますが、開発用だと思います。