JSer.info #338 - ECMAScript 2017が正式リリースされました。

ECMA-262 8th edition - ECMAScript® 2017 Language Specification
-- Ecma latest news

Standard ECMA-262

ES2017ではasync/await、shared memory and atomic、Object.entires/Object.values、String#padStart/String#padEnd、Object.getOwnPropertyDescriptors()や関数内での末尾カンマの許容などが追加されています。

詳細は次のサイトを見るといいかもしれません。

III ECMAScript 2017

今後(ES2018~)で策定していくProposalについては次のページにまとめられています。

整形ツールのPrettier 1.5.0がリリースされました。

Release 1.5.0: GraphQL, CSS-in-JS & JSON · prettier/prettier

GraphQL、CSS in JS、JSONの対応、CSSやTypeScript、JSX周りバグ修正などが行われています。

Leveraging the Performance Metrics that Most Affect User Experience | Web | Google Developersという記事では、ユーザー体験への影響を見るパフォーマンスのメトリクスについて書かれています。

単純にDOMContentLoadedやloadの時間を見るだけでは体験を計測できないという問題があります。
そのため、First Paint/First Meaningful Paing/Time to Interactive(TTI)/Longtasksなどの指標やその意味についてかかれています。

記事の元は、Google I/Oでの発表となっているので併せて動画の方も見るといいかもしれません。

JSer.infoをサポートするには

😘 知り合いにJSer.infoをおすすめする
❤️ GitHub Sponsorsで@azuのスポンサーになる
🐦 X(Twitter)で@jser_infoをフォローする

JSer.info Sponsors

JSer.info SponsorsはGitHub SponsorsとしてJSer.infoを支援してくれている方々です。

ヘッドライン

Release 1.5.0: GraphQL, CSS-in-JS & JSON · prettier/prettier

github.com/prettier/prettier/releases/tag/1.5.0

JavaScript Tools

prettier 1.5.0リリース。
GraphQL、CSS in JS、JSONの対応、CSSやTypeScript、JSX周りバグ修正など

Adding a new layout strategy to Prettier – Geckoboard: Under-the-Hood – Medium

Release v7.0.0-beta.16 · babel/babylon

github.com/babel/babylon/releases/tag/v7.0.0-beta.16

babel AST TypeScript ReleaseNote

Babylon 7.0.0 beta16リリース。
TypeScriptパーサの追加、BigInt(Stage 2)のサポートなど

TypeScript parser by andy-ms · Pull Request #523 · babel/babylon

Ecma latest news

ecma-international.org/news/index.html

ECMAScript news

"ECMA-262 8th edition - ECMAScript® 2017 Language Specification" ES2017がGAで承認されて正式リリースされた。

Standard ECMA-262

Release Notes for Safari Technology Preview 34 | WebKit

webkit.org/blog/7760/release-notes-for-safari-technology-preview-34/

safari ReleaseNote

Safari Technology Preview Release 34リリース。
RTCRtpTransceiver#addTransceiverをサポートしトラック単位での片方向通信を使えるように、W3C Secure Contextsの実装、SRIを試験的にサポートなど

Safari TP 34では新しい片方向WebRTCの手順が使えるようになったので、試してみた - Qiita

アーティクル

Leveraging the Performance Metrics that Most Affect User Experience | Web | Google Developers

developers.google.com/web/updates/2017/06/user-centric-performance-metrics

Chrome performance browser article

ユーザー体験への影響を見るパフォーマンスのメトリクスについて。
ロード時間だけでは体験を計測できないため。
そのため、First Paint/First Meaningful Paing/Time to Interactive/Longtasksを指標にそれぞれ何を意味するかや計測方法について

You Need to know SSR // Speaker Deck

Chrome 60 DevTools の新機能/変更点 - Qiita

qiita.com/kyoshidajp/items/e3f9be02a7ccd00aa7d7

Chrome debug

Chrome 60の開発者ツールの変更点について

NYTimes/kyt: Starting a new JS app? Build, test and run advanced apps with kyt 🔥

github.com/nytimes/kyt

JavaScript Tools

JavaScriptアプリのツールキット。
Babel/webpack/Jest/Stylelint/ESlint/protoなどのセットアップをまとめて行うツール

Supercharged Live Stream Blog: Code Splitting | Web | Google Developers

developers.google.com/web/updates/2017/06/supercharged-codesplit

babel article plugin video

Code Splittingを行うBabelプラグインを作成するスクリーンキャスト

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

Building m.uber: Engineering a High-Performance Web App for the Global Market - Uber Engineering Blog

eng.uber.com/m-uber/

browser mobile JavaScript performance

Uberのモバイル向けの最適化について。
Reactを使っているが、mobileではPreactに置き換えて利用している。
また、サーバサイドレンダリングや、初期bundleサイズを小さくするためのcode split、依存が小さなJustの利用、SWやIndexedDBを使ったキャッシュなどについて。
問題を見つけるためのエラーハンドリングについて。