JSer.info #297 - Angular 2.0.0がリリースされました。

• Angular, version 2: proprioception-reinforcement
• angular/CHANGELOG.md at master · angular/angular
• 🎉✨ Angular 2.0.0がリリースされました 🎉✨ · Angular2 Info
• Angular 2 released!!

AngularJS 2.0.0以降では、Semverに従ってバージョンを上げていくようです。

Node.js 6.6.0がリリースされました

• Node v6.6.0 (Current) | Node.js

6.6.0ではEventEmitterのmemory leak警告と
PromiseのUnhandled rejectionの警告を次のように書くことで受け取れるようになっています。

process.on('warning', (warning) => {
    console.log(warning);
});

• process | Node.js v6.6.0 Documentation
• node/test-promises-warning-on-unhandled-rejection.js at 995d504d396d9a7137b11a4c1abebaafd97c3061 · jasnell/node
• events: make memory leak warning more programatically accessible by addaleax · Pull Request #8298 · nodejs/node

ブラウザでは自動でコンソールにPromiseのUnhandled Rejectionの警告が表示されます。
Node.js 6.6.0でも同様にデフォルトでstderrへ警告が出力されるようになりました。

const p = Promise.reject('This was rejected');
// UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): This was rejected

また、これらの警告は"warning"イベントとしてキャッチすることができるようになっています。

今まで、EventEmitterのメモリリーク警告はstderrにログを出すだけでテストも難しいものでしたが、同じようにwarningイベントで取得できるようになりました。

const events = require("events");
const event = new events.EventEmitter();
event.setMaxListeners(1);
process.on('warning', (warning) => {
    console.warn(warning.message);
    // Warning: Possible EventEmitter memory leak detected. 2 test listeners added. Use emitter.setMaxListeners() to increase limit
});

event.on("test", () => {});
event.on("test", () => {});

• azu/node6.6-warning-demo

Chrome 54 Betaがリリースされましたが、開発者ツールも同様に更新されています。

• DevTools Digest, September 2016: Perf Roundup | Web Updates - Google Developers

CPU Throttling、TimelineにNetwork viewの表示、スクロールパフォーマンスのProfile、SourceパネルにTimelineのデータ表示などのボトルネックを見つける機能が追加されています。

ヘッドライン

Angular, version 2: proprioception-reinforcement

angularjs.blogspot.com/2016/09/angular2-final.html

AngularJS ReleaseNote

AngularJS 2リリース

• 🎉✨ Angular 2.0.0がリリースされました 🎉✨ · Angular2 Info

Node v6.6.0 (Current) | Node.js

nodejs.org/en/blog/release/v6.6.0/

node.js ReleaseNote

Node v6.6.0リリース。
EventEmitterのmemory leak警告、
PromiseのUnhandled rejectionの警告が、process.on('warning', (warning) => { })でキャッチできるように

jQuery UI 1.12.1 | jQuery UI Blog

blog.jqueryui.com/2016/09/jquery-ui-1-12-1/

jQuery UI ReleaseNote

jQuery UI 1.12.1リリース。
新しいテーマの追加、Checkboxradio　widgetの追加、classesオプションの追加など

Release Notes for Safari Technology Preview Release 13 | WebKit

webkit.org/blog/6937/release-notes-for-safari-technology-preview-release-13/

safari webkit ReleaseNote

Safari Technology Preview Release 13 リリース。
adoptedCallbackのサポート、CSS.escapeの実装、クロスオリジンのチェック強化など

Chromium Blog: Chrome 54 Beta: Custom Elements V1, BroadcastChannel, and media platform improvements

blog.chromium.org/2016/09/chrome-54-beta-custom-elements-v1.html

Chrome ReleaseNote

Chrome 54βリリース。
Custom Element v1、BroadcastChannelのサポート。
Resource Timing API のtransferやencoded/decodedのサポート、initTouchEventの削除など

アーティクル

Introducing debugger.html ★ Mozilla Hacks – the Web developer blog

hacks.mozilla.org/2016/09/introducing-debugger-html/

firefox debug

debugger.htmlというソースパネルライクな新しいデバッガーについて。
Firefox、Chrome、Node.jsに対応し、Remote Debug Protocolでデータをやり取りする。
Firefoxの開発者ツールに統合される予定

• debugger.html のご紹介 | Mozilla Developer Street (modest)

DevTools Digest, September 2016: Perf Roundup | Web Updates - Google Developers

developers.google.com/web/updates/2016/09/devtools-digest

debug Chrome

Chrome 54での開発者ツールについて。
CPU Throttling、TimelineにNetwork viewの表示、スクロールパフォーマンスのProfile、SourceパネルにTimelineのデータ表示など

JS web frameworks benchmark – Round 4 | Stefan_Krause.blog()

www.stefankrause.net/wp/?p=316

JavaScript library

AngularやReactなどのライブラリやフレームワークのベンチマーク比較

• Table Report

How Developers use Node.js - Survey Results | @RisingStack

blog.risingstack.com/node-js-developer-survey-results-2016/

node.js アンケート

Node.jsを使ったサーバサイド開発についてのアンケート結果

Why Use Flow? · Aria

blog.aria.ai/post/why-use-flow/

flowtype

FlowによるStatic typeについて

スライド、動画関係

The future of ES6 (Jafar Husain) - Full Stack Fest 2016 - YouTube

www.youtube.com/watch?v=3pKNRgResq0

JavaScript 動画

現在策定中の仕様も含めて非同期処理について。
Promise、Async/Await。
PullなAPIとしてGenerator(同期)、AsyncGenerator(Stage 2)。
PushなAPIとしてObservable(Stage 1)について

Пользовательские свойства как основа архитектуры CSS (FrontTalks) // Speaker Deck

speakerdeck.com/lautsevich/pol-zovatiel-skiie-svoistva-kak-osnova-arkhitiektury-css-fronttalks

CSS スライド

CSS Custom Propertiesについてのスライド。
Fallback、i18n、CSS Custom Propertiesとcalc、JavaScriptからの利用、@supportsについてなど

Testing JavaScript with Jest - Lesson Playlist @eggheadio

egghead.io/playlists/testing-javascript-with-jest-a36c4074

JavaScript testing video

Jestを学ぶスクリーンキャスト

Building Applications with React and Redux in ES6 | Zombie Code Kill

zombiecodekill.com/2016/05/21/building-applications-with-react-and-redux-in-es6/

React redux

ReactとReduxの入門講座

• Building Applications with React and Redux in ES6 | Pluralsight

Developer's guide to accessibility mechanics — Developer's guide to accessibility mechanics

ljwatson.github.io/decks/2016/fromthefront/index.html#cover

accessibility スライド

デフォルトの<a>はどういうサポートがあるからaccessibleであるかについてを独自のリンク実装で見ていく話。
またデフォルトではaccessibleでないツールチップ、タブパネルなどをどう実装するか。
実際にスクリーンリーダーの音を聞きながら確認できる

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

avocode/combokeys: Web browser keyboard shortcuts. CommonJS, NPM.

github.com/avocode/combokeys

JavaScript キーボード library

Mousetrapをforkしたキーボードショートカットライブラリ。
リファクタリングとdocumentへのlistenがデフォルトではないように変更されている

• Handle keyboard shortcuts in the browser with Combokeys

kentcdodds/match-sorter: Simple, expected, and deterministic best-match sorting of an array in JavaScript

github.com/kentcdodds/match-sorter

JavaScript library

オブジェクトの配列から検索するライブラリ。
指定したキーのみを対象にしたり、検索方法などを指定できる

書籍関係

BUILD PACMAN by Jeffrey Biles [Leanpub PDF/iPad/Kindle]

leanpub.com/buildpacman

JavaScript game book

JavaScriptでパックマンを作る書籍。