JSer.info #198 - WebStorm 9がリリースされました。
新たにMeteor、React、Polymer、gulpのサポート等が追加されています。
また、ファイルの種類毎にタブ/スペースのインデント等を指定出来るEditorConfigやESLint、JSCS等のサポートもされています。
他にも色々機能追加されていて、詳しくは以下で解説されています。
- WebStorm 9 released: Meteor support, React and JSX, Gulp integration, and more | JetBrains WebStorm Blog
- What's new in WebStorm 9
PluginでLintのルールを拡張可能なESLint 0.9.0がリリースされました。
Pluginの仕様がstableとなり、ESLintのGovernance ModelやContributors向けのContributingドキュメントが整備されています。
(具体的にはCLAへのサイン、コミットメッセージの書式などのPull Requestを送るときのルールが書かれています)
今後はES6サポートやよりpluginを扱いやすくする仕組みなどがUpcomingにあげられています。(ES6サポートはパーサ側がサポートしてないとできないので、それを待っている感じだと思います)
ng-europeにてAngularJS 2.0について色々な発表がありました。(まだライブラリ自体は公開されてないですが)
以前2.0の構想について書かれたAngularJS: AngularJS 2.0でも出てきていましたが、AngularJS 2.0ではAtScriptというES6にAnnotationsを加えたもので作られていることがKeynote: AtScriptで語られています。
このAtScript(ES6+Annotaions)はtraceur-compiler 入門で書かれているようにTraceurによってTranspileして使うようになっています。
まだソース自体が公開されてないのであまり深い追いしてもしょうがないですが、
ES6+カジュアルトークで発表するスライドにもう少し詳しくまとめてありますので、興味がある人はそちらを見ておくといいかもしれません。
お知らせ
今週末の土曜日にJSer.info 200回記念イベントを行います。
JSer.info 200回記念イベントの質問等まだ募集しているので、#jserinfo をつけて適当につぶやくとかでも募集しています。
JSer.infoをサポートするには
- 😘 知り合いにJSer.infoをおすすめする
- ❤️ GitHub Sponsorsで@azuのスポンサーになる
- 🐦 X(Twitter)で@jser_infoをフォローする
JSer.info Sponsors
JSer.info SponsorsはGitHub SponsorsとしてJSer.infoを支援してくれている方々です。
ヘッドライン
WebStorm 9 released: Meteor support, React and JSX, Gulp integration, and more | JetBrains WebStorm Blog
WebStorm 9リリース。
主に以下の様な機能追加等が中心です。
- Meteor、React/JSX、Polymerのサポート
- PhoneGap、Gulp統合
- spy-js/LiveEditがNode.jsアプリケーションに対応
- ESLint/JSCS/EditorConfigのサポート
- What's new in WebStorm 9
Release Custom Driver Support · mozilla/localForage
github.com/mozilla/localForage/releases/tag/1.1.1
localForage 1.1.1リリース。
defineDriver()メソッドが追加され、任意のCustom Driverを作成して適応出来るようになった。
任意のストレージをバックエンドに実装出来る
mocha/History.md at 2.0.0 · mochajs/mocha
github.com/mochajs/mocha/blob/2.0.0/History.md
mocha 2.0.0リリース。
リポジトリのオーナーがmochajsになった。
Node.js 0.4と0.6のサポート終了
Node v0.10.33 (Stable)
blog.nodejs.org/2014/10/23/node-v0-10-33-stable/
Node v0.10.33リリース
POODLE対策
ESLint 0.9.0 released - ESLint
eslint.org/blog/2014/10/eslint-0.9.0-released/
ESLint 0.9.0リリース。
pluginはstableに、 Governance Modelを追加、ルールの追加や修正など
CodeMirror release 4.7.0 - Google グループ
groups.google.com/forum/#!msg/codemirror/Ry_Mx8BGcQU/NFqd0odfYHQJ
CodeMirror 4.7.0リリース
CoffeeScriptやScala、PHP等のmodeを改善。Textileのサポート、ロゴが新しくなった
アーティクル
TypeScript and the Road to 2.0 - TypeScript - Site Home - MSDN Blogs
blogs.msdn.com/b/typescript/archive/2014/10/22/typescript-and-the-road-to-2-0.aspx
TypeScript 2.0のロードマップ。
1.4でunion typesのサポート、1.5からES6の親和性の向上などを目指す。
またFacebookのFlowやAngularJS 2.0で使われてるAtScriptのチームと一緒にType AnnotaionsをECMAScriptへの提案を進めていく方針
Community Round-up #23 | React
facebook.github.io/react/blog/2014/10/17/community-roundup-23.html
Fluxアーキテクチャのサンプルや解説やライブラリ等のまとめ
写真サービス機能のブラウザ内実装 | 株式会社サイバーエージェント
www.cyberagent.co.jp/recruit/techreport/report/id=8548
iOS 6.0~、Android 4.0~に対応した画像を扱う時に起きる問題と対処について。
iOS 6のファイルサイズの問題、AndroidのtoDataURLがJPEGをサポートしてない問題、フィルタ処理やリサイズについてなどハマりどころをまとめられている
スマートフォンWebのフロントエンドを高速化する取り組み - クックパッド開発者ブログ
techlife.cookpad.com/entry/2014/10/23/095814
モバイル向けの一部ページをシングルページアプリケーションとして作るのに適した条件やメリットについて書かれている。
クライアントサイドでの画像リサイズとアップロードやTouchイベント対応などについて
ECMAScript 6 returns JavaScript to original intent | InfoWorld
www.infoworld.com/article/2837425/javascript/ecmascript-6-returns-javascript-to-original-intent.html
ES6/7についてJafar Husainさん(Async Generatorの人)へのインタビュー。
何故ES6/7を同時進行しているのか、Async functionとAsync Generatorについて、大きなアプリケーションと型の必要性について。
スライド、動画関係
AngularJS カンファレンス（ng-europe 2014）のスライドまとめ - AngularJS Ninja
angularjsninja.com/blog/2014/10/24/slides-at-ngeurope-2014/
ng-europeのスライドまとめ
Keynote: AtScript - Google スライド
docs.google.com/presentation/d/1hr2IM-8G-0RzpB-WY8pLHvxqNggKPzUO0KvEv1IKPws/present#slide=id.p
AtScriptについてのスライド。
AtScriptは新しい言語ではなくES6にTypesとAnnotationsとIntrospectionを追加したもの。
AtScriptのロードマップについても書かれている。
AtScript Primer - Google ドキュメント
docs.google.com/document/d/11YUzC-1d0V1-Q3V0fQ7KSit97HnZoKVygDxpWzEYW0U/preview#
AngularJS 2.0で使われているES6に型定義を拡張したもの。
assert.jsを使ったES6 validなものへTraceurで変換が出来る。またDI等に利用できるMetadata Annotationsがある。
こちらもECMAScript標準への提案を行っていく方針。
ES6 & Traceur
ES6の機能についてのスライド。
機能ごとにいつ、どんな時に使うべきかも書かれている。
またTraceurがどのように動いているかやAngularで使われてるAtScriptの拡張について
Yahoo! JAPAN Creative Blog — 「SCRIPTY#1 」の資料を公開します #scripty01
yj-creative.tumblr.com/post/100569738942/scripty-1-scripty01
SCRIPTYのスライドまとめ。
CSS/BEM、Backbone/Marionette、Angular/Three.js、Polymer、Yahoo!ニュースのブラウザサポート、grunt、ライブコーディング、アクセシビリティなど
In the DOM, no one will hear you scream
www.slideshare.net/x00mario/in-the-dom-no-one-will-hear-you-scream
DOM Based XSSとjQueryによるXSSについてのスライド。
DOM Level、文字列からコードとして実行するメソッド一覧、上書きによる破壊、DOMPurifyによる防止について
christianalfoni WebApp Enthusiast
christianalfoni.github.io/javascript/2014/08/20/react-js-and-flux.html
Backbone/Angular/Flux+Reactでそれぞれ実装した場合の違いを見ながら、Fluxアーキテクチャの特徴について紹介。
Ractive.jsとvue.jsとFluxアーキテクチャを使って同様のサンプルを作ってあります。
ブラウザのパフォーマンスを限界まで高める HTMLコーディングの考え方
ja.slideshare.net/kawada_hiroshi/html-40678123
ブラウザのパフォーマンス最適化の戦略についてのスライド。
極端な例外を除いたパーセンタイルを見てパフォーマンスを調整。
レンダリングの開始時間、Speed Index、Critical Redering Pathを目安にする。
標準化やNavigation Timingについて
サイト、サービス
AurelioDeRosa/HTML5-API-demos
github.com/AurelioDeRosa/HTML5-API-demos
Battery Status API等の広義のHTML5 APIについての仕様とサンプルと記事をまとめたリポジトリ
JS Compatibility Checker
ブラウザ間で互換性のあるコードかをチェックするツール。
ECMAScript5 APIやcaniuseのデータを元にチェックする
Content Security Policy Playground
CSPについて実際に任意の設定を適応して試しながら学べるサイト。
CSP Policyのバリデーションや関連リソースについてもまとめられている
ソフトウェア、ツール、ライブラリ関係
wooorm/mdast
JavaScriptのMarkdownパーサライブラリ。パースした結果をJSON的なASTとして出力する。
gfmやpandoc風の解釈も対応していて、Parser API ライクなドキュメントもあって良さそう
Khan/structuredjs
JavaScriptのコードをプレースホルダー的に書いておいて、入力されたコードがプレースホルダーと一致するかをチェックできるライブラリ。
不一致の場合のエラー情報等も定義でき、学習サイト等で使われる感じ
dameleon/paw.js
TouchEventやPointerEventをハンドリングして、シンプルに扱えるtapイベント等のカスタムイベントを発行してくれるライブラリ。
hughsk/district
指定したディレクトリをnode_modules以下にエイリアスを貼るツール。
モジュールを特定のディレクトリに名前空間的にまとめることができる
