Fork me on GitHub

2014-10-27のJS: WebStorm 9、ESLint 0.9.0、AngularJS 2.0とAtScript

Edit on GitHub 編集履歴を見る

JSer.info #198 - WebStorm 9がリリースされました。

新たにMeteorReactPolymergulpのサポート等が追加されています。

また、ファイルの種類毎にタブ/スペースのインデント等を指定出来るEditorConfigESLintJSCS等のサポートもされています。

他にも色々機能追加されていて、詳しくは以下で解説されています。


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 をつけて適当につぶやくとかでも募集しています。



ヘッドライン


WebStorm 9 released: Meteor support, React and JSX, Gulp integration, and more | JetBrains WebStorm Blog

blog.jetbrains.com/webstorm/2014/10/webstorm-9-released-meteor-support-react-and-jsx-gulp-integration-and-more/

WebStorm ReleaseNote

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

JavaScript library ReleaseNote

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

JavaScript node.js testing ReleaseNote

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.js ReleaseNote セキュリティ

Node v0.10.33リリース

POODLE対策


ESLint 0.9.0 released - ESLint

eslint.org/blog/2014/10/eslint-0.9.0-released/

JavaScript Tools ReleaseNote

ESLint 0.9.0リリース。

pluginはstableに、 Governance Modelを追加、ルールの追加や修正など


CodeMirror release 4.7.0 - Google グループ

groups.google.com/forum/#!msg/codemirror/Ry_Mx8BGcQU/NFqd0odfYHQJ

JavaScript editor library

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

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 JavaScript まとめ

Fluxアーキテクチャのサンプルや解説やライブラリ等のまとめ


写真サービス機能のブラウザ内実装 | 株式会社サイバーエージェント

www.cyberagent.co.jp/recruit/techreport/report/id=8548

ios Android 画像 canvas browser

iOS 6.0~、Android 4.0~に対応した画像を扱う時に起きる問題と対処について。

iOS 6のファイルサイズの問題、AndroidのtoDataURLがJPEGをサポートしてない問題、フィルタ処理やリサイズについてなどハマりどころをまとめられている


スマートフォンWebのフロントエンドを高速化する取り組み - クックパッド開発者ブログ

techlife.cookpad.com/entry/2014/10/23/095814

Android webkit JavaScript mobile

モバイル向けの一部ページをシングルページアプリケーションとして作るのに適した条件やメリットについて書かれている。

クライアントサイドでの画像リサイズとアップロードやTouchイベント対応などについて


ECMAScript 6 returns JavaScript to original intent | InfoWorld

www.infoworld.com/article/2837425/javascript/ecmascript-6-returns-javascript-to-original-intent.html

JavaScript ECMAScript インタビュー

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/

AngularJS スライド まとめ

ng-europeのスライドまとめ


Keynote: AtScript - Google スライド

docs.google.com/presentation/d/1hr2IM-8G-0RzpB-WY8pLHvxqNggKPzUO0KvEv1IKPws/present#slide=id.p

AngularJS スライド

AtScriptについてのスライド。

AtScriptは新しい言語ではなくES6にTypesとAnnotationsとIntrospectionを追加したもの。

AtScriptのロードマップについても書かれている。


AtScript Primer - Google ドキュメント

docs.google.com/document/d/11YUzC-1d0V1-Q3V0fQ7KSit97HnZoKVygDxpWzEYW0U/preview#

AngularJS JavaScript document spec

AngularJS 2.0で使われているES6に型定義を拡張したもの。

assert.jsを使ったES6 validなものへTraceurで変換が出来る。またDI等に利用できるMetadata Annotationsがある。

こちらもECMAScript標準への提案を行っていく方針。


ES6 & Traceur

arv.github.io/ngeurope/#/

ECMAScript JavaScript スライド

ES6の機能についてのスライド。

機能ごとにいつ、どんな時に使うべきかも書かれている。

またTraceurがどのように動いているかやAngularで使われてるAtScriptの拡張について


Yahoo! JAPAN Creative Blog — 「SCRIPTY#1 」の資料を公開します #scripty01

yj-creative.tumblr.com/post/100569738942/scripty-1-scripty01

JavaScript スライド まとめ イベント

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 XSS スライド

DOM Based XSSとjQueryによるXSSについてのスライド。

DOM Level、文字列からコードとして実行するメソッド一覧、上書きによる破壊、DOMPurifyによる防止について


christianalfoni WebApp Enthusiast

christianalfoni.github.io/javascript/2014/08/20/react-js-and-flux.html

JavaScript Flux

Backbone/Angular/Flux+Reactでそれぞれ実装した場合の違いを見ながら、Fluxアーキテクチャの特徴について紹介。

Ractive.jsvue.jsとFluxアーキテクチャを使って同様のサンプルを作ってあります。


ブラウザのパフォーマンスを限界まで高める HTMLコーディングの考え方

ja.slideshare.net/kawada_hiroshi/html-40678123

browser performance スライド

ブラウザのパフォーマンス最適化の戦略についてのスライド。

極端な例外を除いたパーセンタイルを見てパフォーマンスを調整。

レンダリングの開始時間、Speed Index、Critical Redering Pathを目安にする。

標準化やNavigation Timingについて


サイト、サービス


AurelioDeRosa/HTML5-API-demos

github.com/AurelioDeRosa/HTML5-API-demos

HTML5 WebPlatformAPI サンプル

Battery Status API等の広義のHTML5 APIについての仕様とサンプルと記事をまとめたリポジトリ


JS Compatibility Checker

jscc.info/

browser JavaScript Tools

ブラウザ間で互換性のあるコードかをチェックするツール。

ECMAScript5 APIやcaniuseのデータを元にチェックする


Content Security Policy Playground

www.cspplayground.com/

CSP webservice まとめ

CSPについて実際に任意の設定を適応して試しながら学べるサイト。

CSP Policyのバリデーションや関連リソースについてもまとめられている


ソフトウェア、ツール、ライブラリ関係


wooorm/mdast

github.com/wooorm/mdast

Markdown node.js AST library

JavaScriptのMarkdownパーサライブラリ。パースした結果をJSON的なASTとして出力する。

gfmやpandoc風の解釈も対応していて、Parser API ライクなドキュメントもあって良さそう


Khan/structuredjs

github.com/Khan/structuredjs

JavaScript AST library

JavaScriptのコードをプレースホルダー的に書いておいて、入力されたコードがプレースホルダーと一致するかをチェックできるライブラリ。

不一致の場合のエラー情報等も定義でき、学習サイト等で使われる感じ


dameleon/paw.js

github.com/dameleon/paw.js

JavaScript mobile library

TouchEventやPointerEventをハンドリングして、シンプルに扱えるtapイベント等のカスタムイベントを発行してくれるライブラリ。


hughsk/district

github.com/hughsk/district

node.js npm console Tools

指定したディレクトリをnode_modules以下にエイリアスを貼るツール。

モジュールを特定のディレクトリに名前空間的にまとめることができる


この記事へ修正リクエストをする
記事を紹介する