Fork me on GitHub

2017-08-14のJS: Firefox 55、BootStrap 4β、Node.js 8.3.0

Edit on GitHub 編集履歴を見る

JSer.info #344 - Firefox 55.0がリリースされました。

ECMAScriptにおいてはES2017のSharedArrayBuffer、現在Stage 3のObject rest/spread propertiesのサポートが行われています。
加えてrequestIdleCallbackWebVR APIIntersection Observer APIがサポートされています。

また、既存の挙動の変更としてスクロール位置の値を浮動小数点数として返すように変更、Selection APIの仕様追従、WebRTC APIの仕様追従が行われています。

既にChrome(11~)やFireox(50~)でも行われているバックグラウンドタブにおけるsetTimeoutなどのスロットルについてですが、トラッキングスクリプトに対してはさらに強い制約がかかるようになりました。

Geolocation APIとStorage API(ストレージの容量を確認するAPI)はSecure Contexts(つまりHTTPS)でのみ有効となりました。
既にChrome(50~)において、Geolocation APIはSecure Contextのみとなっています。


Bootstrap 4 Beta · Bootstrapが公開されました。Bootstrap 4 alphaから2年弱程度経っています。

3.xからの変更点として、LessからSassへ移行、FlexboxとGridシステムの改善、IE8/9のサポート終了、JavaScriptプラグインの書き直しなどが行われています。
詳細な変更点については次のIssueを見るとよさそうです。


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

このバージョンからV8 6.0が使われるようになり、新しい最適化コンパイラのTurbofanが有効化されています。
そのため、既存の最適化とは異なる傾向が出るようになっています。

たとえば今まではtry/catchを含む関数は最適化が行われませんでしたが、Turbofanでは最適化されるようになっています。また、Function#bindも今まではArrow Functionでラップした関数に比べて遅いものでしたが、ほぼ同等の速度がでるようになっています。
コードの最適化がどのように変わっているかについては、次の記事でコード例と共に紹介されています。

そのため、Optimization killers · petkaantonov/bluebird Wikiで紹介されているような「最適化を妨げるコード」はTurboFanが使われているかで大きく変わっています。(Wikiの内容も更新されています)
興味がある人は読んでみるといいと思います。


ヘッドライン


Release v3.1.0 · sinonjs/sinon

github.com/sinonjs/sinon/releases/tag/v3.1.0

JavaScript library ReleaseNote

Sinon.js 3.1.0リリース
sandboxにファクトリメソッドの追加、
sandbox.stubのリグレッションの修正など


Release v3.5.0 · webpack/webpack

github.com/webpack/webpack/releases/tag/v3.5.0

webpack ReleaseNote

webpack v3.5.0リリース。
Dynamic ImportにwebpackModeのオプションを追加、require.contextにcontext modeの第4引数を追加など


Microsoft/napajs: Napa.js: Multi-threaded JavaScript runtime

github.com/Microsoft/napajs

JavaScript node.js

Node.jsで動くマルチスレッドライブラリ。元々BingでCPU-boundな処理を扱うために作られたもの。
スレッド(Worker)をまとめたZoneがあり、Zoneに対して値を渡してそれぞれのスレッドで処理が行える


Release Notes for Safari Technology Preview Release 37 | WebKit

webkit.org/blog/7862/release-notes-for-safari-technology-preview-release-37/

safari ReleaseNote

Safari Technology Preview Release 37リリース。
navigator.sendBeacondocument.elementsFromPointのサポート。
Promise#finally、optional catch bindingのサポートなど


Node v8.3.0 (Current) | Node.js

nodejs.org/en/blog/release/v8.3.0/

node.js ReleaseNote

Node v8.3.0リリース。
Turbofanが有効化されたV8 6.0へのアップグレード、WHATWG Encodingのサポートなど


Bootstrap 4 Beta · Bootstrap

blog.getbootstrap.com/2017/08/10/bootstrap-4-beta/

CSS library ReleaseNote

Bootstrap 4βリリース。
LessからSassへ、FlexboxとGridシステムの改善、IE8/9のサポート終了、JavaScriptプラグインの書き直しなど


Firefox 55 for developers - Mozilla | MDN

developer.mozilla.org/ja/docs/Mozilla/Firefox/Releases/55

firefox ReleaseNote

Firefox 55リリース。
Object spread/rest operator、SharedArrayBufferに対応。
WebVR、requestIdleCallback、Intersection Observer API対応。
またSelection APIの仕様追従、Geo APIなどがSecure Contextのみで利用可能になるなど


アーティクル


ZEIT – Next.js 3.0

zeit.co/blog/next3

React サーバー library

Next.js 3.0リリース。
Static Exportのサポート、Dynamic Importのサポート、HMRの対応改善など


ES Modules in Node Today! – Web Dev @ Microsoft – Medium

medium.com/web-on-the-edge/es-modules-in-node-today-32cff914e4b

ECMAScript JavaScript Tools node.js

Node.jsで今後サポートが予定されているES modulesを扱えるようにするrequire extension hookライブラリ。
.mjs対応やCommonJSとの相互運用性に考慮したオプションなどを持つ


Passing data between Promise callbacks

2ality.com/2017/08/promise-callback-data-flow.html

Promises JavaScript

Promiseチェイン間における値のやり取りのパターンについて


The Modern Javascript Tutorial

javascript.info/

JavaScript DOM tutorial

JavaScript/DOM APIのチュートリアルサイト。
それぞれの項目ごとに解説やサンプル、演習問題がある。


Introduction to Preact — a smaller, faster React alternative

blog.logrocket.com/introduction-to-preact-a-smaller-faster-react-alternative-ad5532eb6d79

React JavaScript article

Preactについての記事。
Preactとは何か、Reactとの違いや互換性(preact-compat)について。
またPreactの基本的な使い方、preact-cliを使っての開発についてなど


スライド、動画関係


Javascript Performance by mikesherov

slides.com/mikesherov/javascript-performance

JavaScript performance slide

パフォーマンス最適化についてのスライド。
O(n^2)なアルゴリズムを避ける、キャッシュとメモ化、GCを避ける。
不必要なImmutableを避ける、必要ないことはしない、パフォーマンス計測の仕方などについて。
npmやwebpackなど実際のプロジェクトの例などについて


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


Investigating Performance of Object#toString in ES2015

ponyfoo.com/articles/investigating-performance-object-prototype-to-string-es2015

JavaScript V8 performance firefox

V8のObject.prototype.toString()の最適化について。
ES2015でSymbol.toStringTagが追加され、toStringはこの実装を考慮する必要がある。(toString自体はオブジェクトの型判定によく使われている)
オブジェクトがSymbol.toStringTagを実装しているかのフラグをMapで持っておき、持ってない場合は余計なlookupを省くようにしたという話。
元々はSpiderMonkeyでデザインされていた方法をportした内容についての解説。


zeeshanu/learn-regex: Learn regex the easy way

github.com/zeeshanu/learn-regex

正規表現 tutorial

正規表現について簡単にまとめられたドキュメント。
基本的な使い方やメタ文字、フラグなどについて


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


masakazu-yanai/char-canvas: Draw Tool for Ascii Art.

github.com/masakazu-yanai/char-canvas

JavaScript canvas library

CanvasライクなAPIでアスキーアートを扱うライブラリ。


darcyclarke/rawkit: 🦊 Immediately Open Chrome DevTools when debugging Node.js apps

github.com/darcyclarke/rawkit

node.js Chrome Extension console Tools

Chromeの立ち上げとnode --inspectのデバッガーへの接続を自動的に行うことができるツール


JSON to TypeScript interfaces and runtime type-checkers – quicktype

ts.quicktype.io/

JavaScript JSON TypeScript webservice

JSONからTypeScript/JSON Schema/Go/C#/Elmなどの型定義/interfaceを生成することができるツール


ream/ream: 🚀 Framework for building universal Vue.js app

github.com/ream/ream

JavaScript Vue library

UniversalなVueアプリのフレームワーク。
Next.jsやNuxt.jsのディレクトリ構造などの暗黙的な規約ではなく、明示的な設定/コードによりアプリケーションを作れるようにする目的


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