JSer.info #349 - Node.js 8.5.0がリリースされました。
脆弱性があったため無効化されていたV8 Snapshotが有効化されました。
現在のLTSであるv6.11.3も同様の対応が行われています。
- Security updates for all active release lines, July 2017 | Node.js
- Node.js で発生した Hash flooding DoS とその内容について - from scratch
- V8 JavaScript Engine: About that hash flooding vulnerability in Node.js…
console.groupの実装、fs.copyFile/fs.copyFileSyncの追加、--experimental-modulesフラグでES modules(.mjs)をサポート、Performance Timing APIのサポートなどが行われています。
Node.js 8.5.0で追加されたfs.copyFile/fs.copyFileSyncはOSネイティブのコマンドを使い、ファイルシステムによってはcopy-on-writeとなるため大量のファイルをコピーに向いています。
- Add fs.copyFile for copying files, using uvfscopyfile · Issue #14906 · nodejs/node
- fs: add fs.copyFile{Sync} by cjihrig · Pull Request #15034 · nodejs/node
Yarnではfs.copyFileを使うことでインストール速度改善されているようです。
10月のWindows 10 Fall Creators Updateとして提供される予定のMSEdge 16(EdgetHTML 16)の変更点が公開されています。
CSS Gridのサポート、Payment Request APIのサポート、WebVRのサポート、Service Workerの対応など含まれています。
詳しくはBuild 2017のレポートや発表動画でも確認することができます。
また、次の記事で詳しく書かれていますが、メインスレッドとは別のレンダリングスレッドを活用することでレンダリング性能を向上する改善も含まれています。
<canvas>、<select>、<svg>の要素についてはレンダリングスレッドでのレンダリングを行うため、メインスレッドのブロッキングが減るようです。
CoffeeScript 2がリリースされました。
ES2015+に準拠した破壊的変更が含まれます。
CoffeeScript 2のclassや=>は、ES2015のclassや=>として出力されるようになっています。
また、一行コメント(# コメント)がコメントとして出力されるようになり、Async function、JSX、ES module、for...ofの対応などが行われています。
Editor Notes
Geneva, 18 September 2017でECMAScriptは20歳になりました。
JSer.infoをサポートするには
- 😘 知り合いにJSer.infoをおすすめする
- ❤️ GitHub Sponsorsで@azuのスポンサーになる
- 🐦 X(Twitter)で@jser_infoをフォローする
JSer.info Sponsors
JSer.info SponsorsはGitHub SponsorsとしてJSer.infoを支援してくれている方々です。
ヘッドライン
Node v8.5.0 (Current) | Node.js
nodejs.org/en/blog/release/v8.5.0/
Node.js v8.5.0リリース。
V8 Snapshotを再有効化、console.groupの実装、fs.copyFileの追加、--experimental-modulesフラグでES modulesをサポート、Performance Timing APIのサポートなど
V8 JavaScript Engine: V8 Release 6.2
v8project.blogspot.com/2017/09/v8-release-62.html
V8 v6.2リリース。
Object#toString()、ES Proxyのパフォーマンス改善、RegExpのdotAllモードのサポート、FullCodeGen関連のコードを削除など
What's Coming in EdgeHTML 16 - Microsoft Edge Development | Microsoft Docs
docs.microsoft.com/en-us/microsoft-edge/dev-guide/whats-new/edgehtml-16
MSEdge(EdgeHTML) 16の変更点について。
CSS Gridのサポート、Payment Request APIのサポート、WebVRのサポート、Service Workerの対応など
Release 1.7.0: JSX tweaks, Pragma, TypeScript and CSS fixes · prettier/prettier
github.com/prettier/prettier/releases/tag/1.7.0
Prettier 1.7.0リリース。
JSXのフォーマット変更、CSSの大文字小文字の統一、@prettierのpragmaをサポートなど
Announcing CoffeeScript 2
coffeescript.org/announcing-coffeescript-2/
CoffeeScript 2リリース。
ES2015+に準拠した変更が含まれる。classや=>がES2015と同等に、 一行コメントが出力されるようになり、Async function、JSX、ES module、for...ofの対応など
アーティクル
Zero-config code transformation with babel-macros · Babel
babeljs.io/blog/2017/09/11/zero-config-with-babel-macros
babel-macrosを使ったコンパイル時のマクロ処理について。
コンパイル時にfsで取得したSVGをインライン化などに利用できる。
Tumblr Engineering — Flow and TypeScript
javascript.tumblr.com/post/165082071937/flow-and-typescript
TypeScriptとFlowの型エラーメッセージにについての比較
Deploying ES2015+ Code in Production Today — Philip Walton
philipwalton.com/articles/deploying-es2015-code-in-production-today/
moduleをサポートしてるブラウザ向けとそれ以外でビルドしたファイルを分けて配信する方法について。
webpack/babelの設定、ファイルサイズやパース時間の違いなど
A React And Preact Progressive Web App Performance Case Study: Treebo
Reactなアプリの起動速度を改善したケーススタディ。
サーバーサイドレンダリング、ルーティングとコード分割、HTMLのストリーミング配信、CSSのクリティカルパス、SWの利用、Preactへの移行、プレースホルダ表示などについて
Planning for 7.0 · Babel
babeljs.io/blog/2017/09/12/planning-for-7.0
現在βがでているBabel 7.0の予定について。主な変更点やプロジェクトのゴールについて。
Autoplay Policy Changes | Web | Google Developers
developers.google.com/web/updates/2017/09/autoplay-policy-changes
Chromeデスクトップの自動再生ポリシーの変更について。
Safari 11と同様に音がある動画はユーザーインタラクションや幾つかの条件を満たした場合のみ自動再生が可能になる。
Media Engagement Indexやiframeのgesture="media"属性についてなど
- Auto-Play Policy Changes for macOS | WebKit
- Chromium Blog: Unified autoplay
- Autoplay - The Chromium Projects
Building the DOM faster: speculative parsing, async, defer and preload ★ Mozilla Hacks – the Web developer blog
hacks.mozilla.org/2017/09/building-the-dom-faster-speculative-parsing-async-defer-and-preload/
JavaScriptやCSSなどのリソースのロードについて。
async属性、defer属性、rel=preloadでのロードの違いについての解説。
リソースのロードとレンダリングのブロッキングについてを図解している。
Finally the Promise.prototype.finally() is available
hospodarets.com/promise.prototype.finally
現在Stage 3のPromise#finallyについての解説。
Promise#finallyのユースケースについてデモを交えての解説している。またasync/awaitとtry/catch/finallyの組み合わせとの類似点について。
スライド、動画関係
Service Worker Lifecycle by Suguru Inatomi
slides.com/laco/2017-09-14_sw-lifecycle#/
Service Workerのライフサイクルについてのスライド。
Service Workerの登録から削除までのライフサイクルやWorkerの状態について。
デモアプリで実際に実行して確認することができる。
サイト、サービス、ドキュメント
Getting up and running with GraphQL - Pusher Blog
blog.pusher.com/getting-up-and-running-with-graphql/
GraphQLのチュートリアル。
GraphQLの基本的な機能について
ソフトウェア、ツール、ライブラリ関係
ai/size-limit: Prevent JS libraries bloat. If you accidentally add a massive dependency, Size Limit will throw an error.
パッケージのサイズが一定以上になると例外を投げるCLIツール
egoist/package-size: Get the bundle size of an npm package.
github.com/egoist/package-size
npmパッケージのbundleサイズを取得できるツール。
bundleしたファイルサイズ、minified(webpack)、gzipのサイズを一覧できる
hiproxy/hiproxy: 🛠 hiproxy is a lightweight proxy tool for Front-End developers based on Node.js that supports an NGINX-like configuration. 🔥
フロントエンドの開発向けProxyツール。
Nginxライクな設定ファイル、HTTPSの対応など
Quasar Framework
Vueを使ったUIフレームワーク
書籍関係
Learning React Native: Building Native Mobile Apps with JavaScript: Bonnie Eisenman: 9781491989142: Amazon.com: Books
www.amazon.com/Learning-React-Native-Building-JavaScript/dp/1491989149
2017年11月25日発売
React Native本の第二版
Pro TypeScript: Application-Scale JavaScript Development: Steve Fenton: 9781484232484: Amazon.com: Books
2018年5月26日発売
TypeScriptでの開発についての本
作りながら学ぶ React入門 | 吉田裕美 |本 | 通販 | Amazon
www.amazon.co.jp/dp/479805075X
Reactについての入門書。
電子版も発売予定 via https://github.com/jser/ping/issues/74
