Fork me on GitHub

2017-04-04のJS: Safari 10.1、ECMAScript 2017-2018、Reactのパフォーマンス計測/改善

Edit on GitHub 編集履歴を見る

JSer.info #325 - Safari 10.1が正式にリリースされました。

Fetch API、CSS Grid、ES2016+、IndexedDB 2.0、Custom Elements、Gamepad、Pointer Lock、Input Events、download属性、HTML Media Captureなどかなり色々な機能が実装されています。

過去に関連する解説記事も書かれているのであわせてみるとよさそうです。


ES2017 was officially approved by the committee to be sent to the ECMA General Assembly for approval.

-- March 2017 meeting notes by leobalter · Pull Request #64 · rwaldron/tc39-notes

ECMAScript 2017の仕様が固まり、TC39(ECMAScriptの仕様を決める技術委員会)の中で承認され、ECMA General Assemblyに提出されました。

後は、2017年6月27日に行われる次のGA 113th meetingにおいて承認されれば、正式にECMAScript 2017がリリースされます。

ES2017で入る仕様については次の記事でまとめられています。

ES2017の仕様はフリーズされたため、tc39/ecma262のmasterブランチはES2018 draftとなっています。


NOTE:

ECMAScriptのISO標準版であるISO/IEC 16262は、ECMA-414 ECMAScript Specification Suiteという仕様が代わりに提案されています。


ES2018以降に入るかもしれないECMAScriptのProposalのステータスについては下記にまとめてあります。

先月のミーティングでは、正規表現周りの改善Proposalが4つもStage 3へとなりました。
正規表現のProposalに興味がある人は次の記事を見ると良さそうです。


React is Slow, React is Fast: Optimizing React Apps in Practiceという記事ではReactアプリケーションのパフォーマンス計測や改善のアプローチについて書かれています。

?react_perfを使ったコンポーネントプロファイルのとり方と行った計測と改善のアプローチについてがそれぞれ書かれています。


ヘッドライン


normalize.css/CHANGELOG.md at master · necolas/normalize.css

github.com/necolas/normalize.css/blob/master/CHANGELOG.md

CSS ReleaseNote library

normalize.css 6.0.0リリース。
HTML要素やform要素へのfont-familyline-heightなどのopinionated rulesを削除


TC39: Ecma-402 updates | Rafael Xavier

rafael.xavier.blog.br/2017/03/23/tc39-ecma-402-updates/

ECMAScript i18n proposal

Ecma-402(ECMAScript i18n API)のProposalやステータスについて


Release 2.3.0 · qunitjs/qunit

github.com/qunitjs/qunit/releases/tag/2.3.0

JavaScript testing library ReleaseNote

QUnit 2.3.0リリース。
QUnit CLIの追加、CLIからQUnitを実行でき、reporterなどを指定できる。


New Web Features in Safari 10.1 | WebKit

webkit.org/blog/7477/new-web-features-in-safari-10-1/

safari ReleaseNote

Safari 10.1リリース。
Fetch API、CSS Grid、ES2016+、IndexedDB 2.0、Custom Elements、Gamepad、Pointer Lock、Input Events、download属性、HTML Media Captureなど


Node v7.8.0 (Current) | Node.js

nodejs.org/en/blog/release/v7.8.0/

node.js ReleaseNote

Node.js 7.8.0リリース。
npm 4.2.0へアップデート、async functionの修正のバックポートなど


TestCafe v0.14.0 Released | TestCafe

devexpress.github.io/testcafe/blog/testcafe-v0-14-0-released.html

JavaScript testing E2E ReleaseNote

TestCafe v0.14.0リリース。
Roleでログイン情報を決めることができるように、BrowserStackサポート、t.debug()debugger;的なデバッグができるように、file://に対してもテストできるように、Selectorにカスタムメソッドを定義できるようになるなど


Flow: A Static Type Checker for JavaScript

flow.org/en/

flowtype

Flowの公式サイトがリニューアル公開された


Release Almin.js 0.11 · almin/almin

github.com/almin/almin/releases/tag/0.11.0

JavaScript Flux library ReleaseNote

Almin 0.11リリース。
Functional UseCaseのサポート、APIドキュメントの更新、Reactバインディングの追加など


Announcing free Microsoft Edge testing in partnership with BrowserStack - Microsoft Edge Dev BlogMicrosoft Edge Dev Blog

blogs.windows.com/msedgedev/2017/03/30/free-edge-testing-browserstack/

MSEdge webservice

BrowserStackでテスト目的のMSEdgeが無料で利用できるように


アーティクル


ZEIT – Next.js 2.0

zeit.co/blog/next2

JavaScript React library サーバー ReleaseNote

Reactを使ったフレームワークであるNext.js 2.0リリース。
動的なルーティングができるように、next/cssは非推奨となり代わりにstyled-jsxを導入、<Link>prefetchサポート、サンプルの追加、babelの設定などを行えるようになるなど


V8 JavaScript Engine: Help us test the future of V8!

v8project.blogspot.com/2017/02/help-us-test-future-of-v8.html

Chrome V8 article

V8の新しいコンパイラーパイプラインであるIgnition interpreterとTurbofan compilerを有効化する方法について。
またバグを見つけた時の報告先について


Writing Better JavaScript with Flow — SitePoint

www.sitepoint.com/writing-better-javascript-with-flow/

flowtype tutorial article

Flowの基本的な使い方についての解説記事。
型の付け方、ライブラリの型、型アノテーションの取り除き方について


React is Slow, React is Fast: Optimizing React Apps in Practice

marmelab.com/blog/2017/02/06/react-is-slow-react-is-fast.html

React performance

Reactのパフォーマンス計測と改善について。
?react_perfを使いコンポーネントプロファイル、why-did-you-updateでのコンポーネントの更新時間の計測。
shouldComponentUpdateでの無駄な更新を排除することでの改善、RecomposeやReselect、React/JSXの使い方での改善について


Svelte ナメてたけど結構スゴい - Qiita

qiita.com/jgs/items/2d985894ea07f48b74fb

JavaScript UI library

HTML/CSS/JSをセットで書いたコンポーネントをJavaScript+小さなランタイムに変換するUIフレームワークであるSvelteについて


Regular Expressions in a post-ES6 world

ponyfoo.com/articles/regular-expressions-post-es6

ECMAScript JavaScript proposal

ES2015以降の正規表現の追加された仕様とProposalの仕様について


Vue.js Tutorial: A Prerendered, SEO-Friendly Example [Live Demo] - Snipcart

snipcart.com/blog/vuejs-tutorial-seo-example

JavaScript Vue tutorial article

Vue.jsのチュートリアル。 PrerenderSpaPluginを使うことで、静的なHTMLを吐けるようにするところまでを行う話


ECMAScript proposal updates @ 2017-03 | ECMAScript Daily

ecmascript-daily.github.io/ecmascript/2017/04/04/ecmascript-proposals-status

ECMAScript proposal

ECMAScript Proposalの最新の変更まとめ。
正規表現系のProposalがStage 3になった。


スライド、動画関係


君はyarn.lockをコミットしているか?

www.slideshare.net/teppeis/do-you-commit-yarnlock

yarn slide

ライブラリでyarn.lockをコミットすることによるdevDepsの固定のメリットについて。
devDepsの方がBreaking Changeは起きやすいため固定することによるメリットがあるという話


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


Vue.js Tutorial: A Prerendered, SEO-Friendly Example [Live Demo] - Snipcart

snipcart.com/blog/vuejs-tutorial-seo-example

JavaScript Vue tutorial

Vue.jsのチュートリアル。
PrerenderSpaPluginを使うことで、静的なHTMLを吐けるようにするところまでを行う話


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


sdgluck/mewt: Immutability in under one kilobyte

github.com/sdgluck/mewt

JavaScript library

Proxyを使ったシンプルなImmutableラッパーライブラリ


書籍関係


はじめに | Reset CSSフレンズ

friends.o2p.jp/

CSS ebook

ユーザーエージェントによるCSSの特徴を上書きしていくReset CSSやnormalize.cssなどがどのようなスタイルを当てているかについての解説


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