JSer.info #222 - ES6+のコードをES5相当に変換するツールであるBabelの5.0.0がリリースされました。
変更内容について詳しくは以下を見るといいと思います。
大きな変更点としてはブログ記事にも書かれていますが、今までES7以降の機能はexperimentalオプションで有効化して使えるようになっていました。
5.0.0からはexperimentalオプションを削除して、代わりにTC39 Processに沿った--stage 0というようにstage別のオプションを指定して使うようになります。
ECMAScriptを策定するプロセスであるTC39 Processでは、Stage 0からStage 4の5段階に分かれていて、Stage 4は次期仕様に含まれるという感じになっています。
Stage 2 - Draftぐらいになると、大きな反論がなければ次の仕様に入るというレベルなので、BabelではStage 2の仕様の実装がデフォルトで有効化されています。(またStage 3 - Candidateでは仕様のドラフトに対するフィードバックをどんどん行う段階なので、Babelを使うことでフィードバックがしやすくなると思います)
明日には使えなくなるES7トークのスライドで簡単に紹介してるので、こちらも見てみるといいかもしれません。
つまり、これはどういう事かというと今まで次期ECMAScriptに入るかもしれないという実験的という意味で仕様と若干の距離がありました。
しかし、今後は次期ECMAScriptのどのStageの仕様の実装という事が明確になって、ユーザーはBabelを使って挙動をイメージしやすくなるので、仕様に対してもフィードバックしやすくなって仕様と実装の距離が近くなると思います。
世界のJavaScriptを読もう @ 2014でも書いていましたが仕様策定者は仕様へのフィードバックを求めているけど、仕様のリリース速度が早くなったり幅広くなることで、ユーザーはそれに気づかないでフィードバックする機会を失う問題というのが起こりやすくなっていると思います。
Babelがその隙間を少しでも埋めることを期待する変更だと思います。
他の変更点としてはbabelrcというドキュメント化されていなかった設定ファイルのドキュメントを追加、Pluginsのサポート、ES6 Classesでconstructor()時にsuper()を呼んでいない場合にエラーとするように変更されています。
パッケージ管理ツールであるBower v1.4.0がリリースされました。
何故か今まで出来なかったloginとunregisterコマンドがサポートされました。
またpacakge.jsonにBowerの設定を書けるように、--save-exactのサポート等がされています。
JavaScriptコードスタイルチェックツールであるJSCS v1.12.0がリリースされました。
このバージョンでは一部自動整形機能がサポートされて、-xオプションを付けることで既存のコードに対してルールを用いた整形を行う事が出来ます。
(現時点ではスペースや改行などのみで、構造的な変更が必要な整形はされない)
jscs -x
JSCSではjscs --auto-configure pathとすることで、既存のコードからそれに近いコードスタイルセットを選んだり、インタラクティブに個別のルールを設定できたりするので、途中からでも導入しやすいような作りになってきています。
実際にJSCSを導入してみましたが、--auto-configureでコードスタイルセットを作成して、-xでスペース等が自動で整えられて、構造的な部分もWebStormのQuickFixで自動的に書き換え出来るようなものだったので意外と導入はすんなりできた感じがします。
gofmtのようにリポジトリに設定が入っていれば細かいコードスタイルはツールが自動で揃えてくれるようになると便利になりそうな感じはしました。(現時点ではそこまでパワフルではないですが)
JSer.infoをサポートするには
- 😘 知り合いにJSer.infoをおすすめする
- ❤️ GitHub Sponsorsで@azuのスポンサーになる
- 🐦 X(Twitter)で@jser_infoをフォローする
JSer.info Sponsors
JSer.info SponsorsはGitHub SponsorsとしてJSer.infoを支援してくれている方々です。
ヘッドライン
Announcing TypeScript 1.5 Alpha - TypeScript - Site Home - MSDN Blogs
blogs.msdn.com/b/typescript/archive/2015/03/27/announcing-typescript-1-5-alpha.aspx
TypeScript 1.5αリリース。
ES6 modulesなどの対応、デコレータのサポート、Sublime Textプラグインの追加など
Firefox — Notes (37.0) — Mozilla
www.mozilla.org/en-US/firefox/37.0/releasenotes/
Firefox 37リリース。
Typed ArrayにもArrayメソッドの追加、Web Audio APIを最新の仕様に追従、Web Worker内でIndexedDBを使えるようになる等
Release v2.0.0 · eslint/espree
github.com/eslint/espree/releases/tag/v2.0.0
ESLintが使うASTパーサであるespree 2.0.0リリース。
ESTree仕様への追従のためにBreaking Change、superの対応、RestElementへの対応など
less.js/CHANGELOG.md at v2.5.0 · less/less.js
github.com/less/less.js/blob/v2.5.0/CHANGELOG.md
less.js 2.5.0リリース。
スコープ内でも@pluginが動作するように、パーサのパフォーマンス改善や細かい警告の修正など
5.0.0 Released · Babel
babeljs.io/blog/2015/03/31/5.0.0
Babel 5.0.0リリース。
--experimentalを廃止して、ECMAScriptを策定してるTC39のプロセスを元にしたStageベースのフラグを導入。またES7のDecoratorsなどの実装を追加、class継承でのsuper()の呼び出しチェックを追加するなど
flow/Changelog at v0.8.0 · facebook/flow
github.com/facebook/flow/blob/v0.8.0/Changelog
FlowType 0.8.0リリース。
Release v1.4.0 · bower/bower
github.com/bower/bower/releases/tag/v1.4.0
Bower 1.4.0リリース。
loginとunregisterコマンドをサポート、pacakge.jsonにBowerの設定を書けるように、--save-exactのサポートなど
- Unregister and login commands (rebased) by sheerun · Pull Request #1719 · bower/bower
- Accept npm's config variables in package.json · Issue #1711 · bower/bower
Release v1.12.0 · jscs-dev/node-jscs
github.com/jscs-dev/node-jscs/releases/tag/v1.12.0
JSCS 1.12.0リリース。
自動整形機能のサポート(-xオプション)、ルールの追加、Auto-configurationのエラー表示の改善など
Node v0.12.2 (Stable)
blog.nodejs.org/2015/03/31/node-v0-12-2-stable/
Node v0.12.2リリース。
harmony:specification_drafts [ES Wiki]
wiki.ecmascript.org/doku.php?id=harmony:specification_drafts#april_3_2015_rev_37_release_candidate_4
ECMAScript 2015(ES6) RC4リリース。
TC39で承認されたバージョン、"Edition 6"という記述を"ECMAScript 2015"に置換するなど
- Allen Wirfs-Brock on Twitter: "@rwaldron @SlexAxton RC4 replaced a lot of "Edition 6" with "ECMAScript 2015". Will help with ISO version aka ISO/IEC-16262 Edition 4"
- Allen Wirfs-Brock on Twitter: "The final ES6 draft will be RC4 which I will finalize and forward to Ecma next week."
WebStorm 10 released: improved JavaScript support, TypeScript 1.4, V8 profiling, and more | JetBrains WebStorm Blog
blog.jetbrains.com/webstorm/2015/03/webstorm-10-released/
WebStorm 10リリース。
ES6のサポート改善、TypeScript 1.4のサポート、spy-jsで依存関係の表示、多段SourceMapに対応、V8のプロファイリングのサポートなど
アーティクル
Live Editing JavaScript with Webpack (Part III)
jlongster.com/Backend-Apps-with-Webpack--Part-III
webpackのhot module replacementの仕組みについての解説。
リロードなしでモジュールの変更をする仕組みについて
Auto-formatting JavaScript Code Style — Medium
medium.com/@addyosmani/auto-formatting-javascript-code-style-fe0f98a923b8
JSCS 1.12.0で自動整形機能が入り、JSCSを使ってSublime Textで自動整形を行う方法について。
CSS Font LoadingとFont Face Observer、Web Font Loader - Weblog - Hail2u.net
hail2u.net/blog/webdesign/css-font-loading-font-face-observer-and-web-font-loader.html
CSS Font Loadingと同様の機能を提供するshim的なライブラリの比較
Jam3/jam3-lesson-module-basics
github.com/Jam3/jam3-lesson-module-basics
小さいnpmのモジュールを使ってクライアントサイドの開発をしようという紹介記事。
実際にBrowserifyなどを使ってどうやって開発するかについて紹介している
the-offline-cookbook-ja/ja.md at master · kuu/the-offline-cookbook-ja
github.com/kuu/the-offline-cookbook-ja/blob/master/ja.md
The offline cookbookの翻訳。
Service Workerのパターンについて書かれている
スライド、動画関係
Service Workerハッカソン資料まとめ - dackdive's blog
dackdive.hateblo.jp/entry/2015/04/04/163234
Service Workerハッカソンのスライドや動画のまとめ
サイト、サービス
SemVer checker
npmのsemver計算機
バージョン文字列からどのバージョンにマッチするかを確認できる
ECMAScript 6: Feature Overview and Comparison
ES6とES5の書き方を項目毎に比較紹介してるサイト
sorting algorithms in javascript
h3manth.com/javascript-sorting/
JavaScriptでソートアルゴリズムの実装
ソフトウェア、ツール、ライブラリ関係
azu/wait-for-element.js
github.com/azu/wait-for-element.js
CSSセレクタにマッチする要素が表示されるまで待つライブラリ。
MutationObserverを使った実装とsetTimeoutを使った実装を持ってる
mohebifar/xto6
ES5のコードをES6へ変換するTranspiler
