Fork me on GitHub

2016-05-10のJS: Angular 2 RC、Firefox開発者ツールの新機能、クロージャーの解説

Edit on GitHub 編集履歴を見る

JSer.info #278 - Angular2 RC1がリリースされました。

長い間betaでしたが、RCでは一つの大きなangular2というパッケージではなく、@angular/coreのようなscoped packagesに分割されています。

以下の記事にどのような名前空間の変更があったのかわかりやすくまとまっています。


Developer Edition 48 – Firebug features, editable storage, inspector improvements and more… ★ Mozilla Hacks – the Web developer blogという記事ではFirefox Developer Edition 48に入った新しい開発者ツールの機能について書かれています。

Firebug由来のDOMパネルが追加されたり、メモリパネルにツリーマップ表示が表示されたりデバッグに便利な機能が増えています。


Let’s Learn JavaScript Closures — Free Code Campという記事では"JavaScriptのクロージャー"について詳細に解説されています。

ECMAScriptの仕様ではLexical EnvironmentやRealmという用語がクロージャーの仕組みに関係していますが、これらの用語にも触れながらどういう仕組みで成り立っているのかが解説されています。

記事ではクロージャーのみについてですが、この仕組みがわかっているとArrow Functionが宣言しているスコープのthisを引き継ぐように見えるのかが、理解しやすくなるかもしれません。


ヘッドライン


Release 2.4.0 - 2016.05.08 · zloirock/core-js

github.com/zloirock/core-js/releases/tag/v2.4.0

JavaScript library ReleaseNote

core-js 2.4.0リリース。
Stage 1 ProposalのObservableを追加など


jsdom/Changelog.md at 9.0.0 · tmpvar/jsdom

github.com/tmpvar/jsdom/blob/9.0.0/Changelog.md

JavaScript DOM libre ReleaseNote

jsdom 9.0.0リリース。
mutation eventsの削除し今後MutationObserverを追加する予定。
DOMTokenList#replaceDOMTokenList#contains、XHRの改善など


Node v6.1.0 (Current) | Node.js

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

node.js ReleaseNote

Node v6.1.0リリース。
deepEqual()/deepStrictEqual()が循環参照してるオブジェクトを扱えるように、process.cpuUsage()の追加、util.inspect()にオプションを追加するなど


Dev.Opera — What’s new in Chromium 50 and Opera 37

dev.opera.com/blog/opera-37/

Opera Chrome ReleaseNote

Opera 37 (based on Chromium 50)リリース。
/regexp/u、well-known symbols、preload link、DomTokenList#supports、非推奨or削除するメソッドの更新など


angular/CHANGELOG.md at 2.0.0-rc.1 · angular/angular

github.com/angular/angular/blob/2.0.0-rc.1/CHANGELOG.md

AngularJS ReleaseNote

Angular2 RCリリース。
Scoped Packagesを使うように変更、Offline Compilerを使ったstaticな方式とbootstrap時に処理する方式の両方をサポート、名前空間の変更など


アーティクル


A Taste of JavaScript’s New Parallel Primitives ★ Mozilla Hacks – the Web developer blog

hacks.mozilla.org/2016/05/a-taste-of-javascripts-new-parallel-primitives/

JavaScript

SharedArrayBufferについて。
WebWorkerでのメモリを共有した並列処理について


Introducing Global CSS Property Usage on Microsoft Edge Dev | Microsoft Edge Dev Blog

blogs.windows.com/msedgedev/2016/04/11/css-usage-platform-data/

Chrome MSEdge browser CSS

MSEdgeとChromeでクロールしたCSSプロパティの使用率の統計情報が見れるGlobal CSS Property Usageについて


Developer Edition 48 – Firebug features, editable storage, inspector improvements and more… ★ Mozilla Hacks – the Web developer blog

hacks.mozilla.org/2016/04/developer-edition-48-firebug-features-editable-storage-inspector-improvements-and-more/

firefox debug

Firefox 48の開発者ツールについて。
Firebug由来のDOMパネル、コンソール機能の追加、localStorageなどの編集機能、メモリ使用量の表示改善しGCされてないオブジェクトを見つけやすくなるなど


Custom elementsはES6のclass記法で定義可能になりそうです - Qiita

qiita.com/yoichiro@github/items/fdb8372bd8a68c754dc3

WebComponents

Custom Elementsの仕様が大幅にアップデートされて、classを継承した形で新しい要素を定義できるようになる仕様について


Let’s Learn JavaScript Closures — Free Code Camp

medium.freecodecamp.com/lets-learn-javascript-closures-66feb44f6a44

JavaScript

JavaScriptのクロージャーについて詳しい解説。
Enviroment、RealmなどのECMAScriptの言語仕様に触れながら、どのような仕組みになっているかを解説してる


IntersectionObserver’s Coming into View | Web Updates - Google Developers

developers.google.com/web/updates/2016/04/intersectionobserver

WebPlatformAPI performance JavaScript

Chrome 51で入るIntersectionObserverについての解説記事。
要素がviewport内に表示されたら発火するイベントを設定できる。(発火するしきい値も指定できる)
また、rootに対するClientRectの情報なども取得でき、lazyloadや無限リストなどの実装に利用できる


スライド、動画関係


Forward 4 Web Summit - YouTube

www.youtube.com/watch?v=57MmZtd03ks&list=PLndbWGuLoHebKI8krCzJU88Rf3TwhNZvH&index=17

JavaScript イベント 動画

Forward 4 Web Summitの動画一覧


サイト、サービス、ドキュメント


MaintainableCSS - an approach to writing modular, scalable and maintainable CSS | By Adam Silver

maintainablecss.com/

CSS 設計

メンテナンスしやすいCSSについて書かれたサイト。


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


outbrain/postit: An elegant wrapper for postMessage

github.com/outbrain/postit

JavaScript library

postMessageのラッパーライブラリ


twada/universal-deep-strict-equal: A port of Node v6's internal _deepEqual function in a universal style

github.com/twada/universal-deep-strict-equal

JavaScript library testing

ブラウザでも動作するdeepStrictEqualの実装ライブラリ


bbc/VideoContext: An experimental HTML5 & WebGL video composition and rendering API.

github.com/bbc/VideoContext

動画 audio API

Web Audio APIのような形でVideoを処理できるライブラリ


edenspiekermann/iframify: Replace a node with an iframe version of itself

github.com/edenspiekermann/iframify

DOM JavaScript

DOM要素をiframe内に同じものを作って入れ替えるライブラリ


perflint/perflint: Perflint is a tool to identify unexpected performance levels of a Website

github.com/perflint/perflint

performance console Tools

WebPageTestのCLIフロントエンド。
よくみるLint風の結果表示をしてくれる。


書籍関係


Service Worker Development Cookbook, Sean Amarasinghe, eBook - Amazon.com

www.amazon.com/Service-Worker-Development-Cookbook-Amarasinghe-ebook/dp/B01F3LATMY

ServiceWorker book

2016年11月4日発売
Service Workerについての書籍


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