JSer.info #425 - コンポーネント開発環境であるStorybook 5.0.0がリリースされました。

UIやキーボードショートカットやURLの構造などが変更されています。

破壊的な変更としてwebpack設定の引数の変更、options addonが非推奨になるなどの変更が入っています。
マイグレーション方法については次のページにまとめられています。

Preactの次期メジャーバージョンであるPreact X(10.0.0)のα版が公開されています。

Release Preact X is here 🎉 · developit/preact

Fragment、componentDidCatch、Hooks、createContext、CSS Custom Propertiesに対応しReactのアップデートに追従しています。またpreact-compatを別パッケージではなくpreact/compatとして同梱するようになっています。

破壊的な変更として、string refやcreateClassといったすでに非推奨だったものが削除されています。
また、setStateが同期的にstateを変更しなくなる(Reactも同様)変更やVNodeのプロパティ構造の変更などが行われています。

合わせてPreact Xについての発表動画を見るとわかりやすいかもしれません。

This.JavaScript - State of Frameworks & Libraries - YouTube

今週のTweet

Page Weight Percentiles: overall & by resource type

If one of these categories is super high for a site, it's often an indicator that there's "low hanging fruit" performance wins to be had by optimizing that resource type.

(Data source: @HTTPArchive, Desktop Oct'18 data) pic.twitter.com/JSEsEUejE8
— Katie Hempenius (@katiehempenius) March 5, 2019

HTTP Archiveのデータをもとにウェブサイトのサイズをパーセンタイルで表現した図です。
JavaScriptのファイルサイズをみると、ウェブサイトの50%は420KB以下ですが、10%は1.2MB以上のファイルサイズとなっていることがわかります。

このHTTP Archiveの元データは誰でもBigQueryからアクセスできるようになっているので、興味がある人は以下のドキュメントを見てみると良いかもしれません。

httparchive.org/gettingstarted_bigquery.md at master · HTTPArchive/httparchive.org

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

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

JSer.info Sponsors

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

ヘッドライン

February 2019 Security Releases | Node.js

nodejs.org/en/blog/vulnerability/february-2019-security-releases/

node.js security ReleaseNote

Node.jsのセキュリティ修正リリース。Node.js LTS全部に対して修正がででている。
keep-alive系のDoSが2種(どちらもimpactはlow)とOpenSSL脆弱性(Node 10+は影響なし)の修正がされている。

Ember.js - Ember 3.8 Released

emberjs.com/blog/2019/02/27/ember-3-8-released.html

JavaScript library ReleaseNote

Ember 3.8リリース。
Element Modifier Managerの追加、Array helperの追加など

Release v5.0.0 · storybooks/storybook

github.com/storybooks/storybook/releases/tag/v5.0.0

JavaScript ReleaseNote UI

Storybook 5.0.0リリース。
デザインとURL構造の変更、ショートカットの変更、webpackのカスタム設定の引数を変更など

Release Preact X is here 🎉 · developit/preact

github.com/developit/preact/releases/tag/10.0.0-alpha.0

React library ReleaseNote

Preact X α版リリース。
Fragment、componentDidCatch、Hooks、createContext、CSS Custom Propertiesに対応など。
またpreact-compatを別パッケージではなくpreact/compatとして同梱するようになるなど

This.JavaScript - State of Frameworks & Libraries - YouTube

TestCafe v1.1.0 Released | TestCafe

devexpress.github.io/testcafe/blog/testcafe-v1-1-0-released.html

testing JavaScript E2E ReleaseNote

TestCafe 1.1.0リリース。
TypeScript 3.3サポート、TypeScriptの型改善など

アーティクル

HTML Snapshot Testing with Node

spin.atomicobject.com/2019/02/13/html-snapshot-testing-with-node/

JavaScript article testing

HTMLのスナップショットを比較するスナップショットテストについての記事。
スナップショットテストをどのように実装するかについて

Progressive React

houssein.me/progressive-react

React article performance

Reactを中心にしたウェブアプリの改善についての話。
Reactレベルとアプリレベルでのパフォーマンスについて。
shouldComponentUpdateでの無駄なレンダリングの最小化、バンドルサイズとCode Splitting、キャッシュやSSRによる初期表示の改善、クリティカルパスの最適化などについて