JSer.info #343 - React Componentの開発環境ツールであるStorybook 3.2がリリースされました。
3.2からはVueのコンポーネントをサポートやメニューの階層表示をサポート、onDeviceUI
のオプションをサポートなどが行われています。
@storybook/reactの代わりに@storybook/vueを使うことでVueのコンポーネントをプレビュー環境で確認できるようになります。
babel-polyfillなどからも使われているpolyfillライブラリのcore-js 2.5.0がリリースされました。
2017年7月に行われたTC39のMeetingの内容を反映した更新が行われています。
- ECMAScript proposal updates @ 2017-07 | ECMAScript Daily
- 2017年7月のミーティングで変更があったProposalのまとめ
Promise#finally
、Promise.try
、Array#flatten
、Array#flatMap
の追加。 Collectionのof
/from
静的メソッドの追加、Math
のProposalの追加、DOM collectionのiterable対応の更新などが行われています。
Linting in Flow – Flow – Mediumという記事では、Flow 0.52で追加されたFlowlintについて解説されています。
Flowに内蔵されているLinting Frameworkで、ESLintなどのようにルール毎にSeverity Levelsが設定できるようになっています。また、Flowlint Commentsを使うことで、コメントで部分的にルールを無効することもできるようになっています。
import type {
// flowlint untyped-type-import:off
Foo,
Bar,
Baz,
// flowlint untyped-type-import:error
} from './untyped.js';
まだ自分でLint Ruleを追加する方法は書かれていませんが、今後のドキュメントを整備していくようです。
JSer.infoをサポートするには
- 😘 知り合いにJSer.infoをおすすめする
- ❤️ GitHub Sponsorsで@azuのスポンサーになる
- 🐦 X(Twitter)で@jser_infoをフォローする
JSer.info Sponsors
JSer.info SponsorsはGitHub SponsorsとしてJSer.infoを支援してくれている方々です。
ヘッドライン
Release v3.2.0 · storybooks/storybook
github.com/storybooks/storybook/releases/tag/v3.2.0
Storybook 3.2.0リリース。
Vueのサポート、メニューの階層表示をサポート、onDeviceUI
のオプションをサポートなど
TestCafe v0.17.0 Released | TestCafe
devexpress.github.io/testcafe/blog/testcafe-v0-17-0-released.html
TestCafe v0.17.0リリース
testcafe-browser-provider-electron
の追加、-c
オプションでConcurrentなテストを実行できるように、Automatic waitの仕組みを改善など
Release v3.0.0 · sinonjs/sinon
github.com/sinonjs/sinon/releases/tag/v3.0.0
Sinon.js 3.0.0リリース。
Deprecatedとなっていたメソッドを削除、Fake XHR/Fake Serverはniseモジュールへ移動された。
format.setFormatter
の追加など
V8 JavaScript Engine: V8 Release 6.1
v8project.blogspot.com/2017/08/v8-release-61.html
V8 6.1リリース。
Map
/Set
/Object#isPrototypeOf()
/Reflect.construct
のパフォーマンス改善。
asm.jsのコードを検証してからwasmへコンパイルするようになるなど
Workspaces in Yarn | Yarn Blog
yarnpkg.com/blog/2017/08/02/introducing-workspaces/
lernaのようなmonorepo管理の仕組みであるyarn workspaceについての紹介。
オプションで有効化できる実験的な機能。リポジトリ内の複数のパッケージを管理して、それぞれのパッケージが依存するモジュールはsymlinkで解決できる。
Glamorous v4 is here 💄 🎉 🎊 – Kent C. Dodds – Medium
medium.com/@kentcdodds/glamorous-v4-is-here-c678fe02a39a
CSS in JSなライブラリのglamorous v4リリース。
theme
引数の削除、useDisplayNameInClassName
の削除。
withProps
、propsAreCssOverrides
、shouldClassNameUpdate
のサポートなど
Release 2.5.0 - 2017.08.05 · zloirock/core-js
github.com/zloirock/core-js/releases/tag/v2.5.0
core-js 2.5.0リリース。
Promise#finally
、Promise.try
、Array#flatten
、Array#flatMap
の追加。
Collectionのof
/from
静的メソッドの追加、Math
のProposalの追加、DOM collectionのiterable対応の更新、ProposalのStage対応など
アーティクル
JavaScriptフレームワーク選定の議論 - Qiita
qiita.com/azu/items/2921f62127b8d3a1aa03
JavaScriptのフレームワーク選定やTypeScript/Flowといった言語の選択について。 それぞれのカテゴリにどのような選択肢があり、どのように選択していくのかについて
This in JavaScript | Zell Liew
JavaScriptのthis
についての解説。
グローバル、オブジェクト、メソッド、関数、Arrow Function、イベントハンドラなどにおけるthis
について。
またthis
をバインドするbind
について
[email protected] を試した -トランスパイル環境をスケールさせていく- | mediba Creator × Engineer Blog
ceblog.mediba.jp/post/163780014387/babel-preset-env-v2
現在αリリースされているbabel-preset-env 2.0αについて。 静的解析した結果のpolyfillだけを読み込む"useBuiltIns": "usage"
の解説と挙動について。
Linting in Flow – Flow – Medium
medium.com/flow-type/linting-in-flow-7709d7a7e969
Flow 0.52.0で追加されたFlow linterについての解説。
ESLintのように.flowconfig
やコメントでルール毎に有効/無効/エラーレベルの制御できる。
スライド、動画関係
component test // Speaker Deck
speakerdeck.com/bokuweb/component-test
ビジュアルリグレッションツールのreg-suitについてのスライド。
スナップショットとして保存した画像同士を比較しリグレッションを検知する。
プラグインでスナップショットの保存先や通知先を変更できる。
Get ready: A new V8 is coming, Node.js performance is changing. | nearForm
www.nearform.com/blog/node-js-is-getting-a-new-v8-with-turbofan/
V8のバージョンごとの典型的なケースにおけるパフォーマンスについて。TurboFunによる最適化の違い。
try-catch、delete
とundefined
の代入、argumetns
の渡し方の違い、bind、forループ、オブジェクトの生成などのケースいおける比較
真のコンポーネント粒度を求めて // Speaker Deck
speakerdeck.com/takazudo/zhen-falsekonponentoli-du-woqiu-mete
CSSとコンポーネントについてのスライド。
OOCSSやBEMにおけるコンポーネント、Atomic Designにおけるコンポーネントの粒度と抽象化、抽象化を避けたECSSコンポーネントなどについて
複雑なJavaScriptアプリケーションに立ち向かうためのアーキテクチャ // Speaker Deck
speakerdeck.com/shinpeim/fu-za-najavascriptapurikesiyonnili-tixiang-kautamefalseakitekutiya
見通しが悪いものを分割統治する話。
プレゼンテーションとドメインの分離(MV*)、モデルをレイヤー分けについて。
レイヤードアーキテクチャのコンセプトとしてのクリーンアーキテクチャやCQRSについて。
また具体的な実装についてなど
サイト、サービス、ドキュメント
The Critical Request | CSS-Tricks
css-tricks.com/the-critical-request/
クリティカルリクエストについて。
開発者ツールでリクエストのPriorityを見る方法、またPriorityはどのように付けられているか。
First meaningful paintを妨害するリクエストの見つけ方、Priorityをrel=preload
を使っての管理について
StackBlitz
VSCodeを使ったオンラインIDE、コードシェアサービス。
Hot reloading、npmモジュールの管理、書いたコードの公開などができる
ソフトウェア、ツール、ライブラリ関係
deepsweet/hocs: A collection of Higher-Order Components for React
React用のHigh Order Componentを集めたライブラリ。
Propsの除外、LifeCycleのhook、debounce、throttleなど
書籍関係
Node.js 8 the Right Way - O'Reilly Media
shop.oreilly.com/product/9781680501957.do
2017年10月発売
Node.js v8についての書籍
インクルーシブHTML+CSS & JavaScript 多様なユーザーニーズに応えるフロントエンドデザインパターン | Heydon Pickering, 太田良典, 伊原力也, 株式会社Bスプラウト |本 | 通販 | Amazon
www.amazon.co.jp/dp/4862463878
2017年9月29日発売
Inclusive Design Patternsについての翻訳本
最新JavaScript開発~ES2017対応モダンプログラミング | 電子書籍とプリントオンデマンド(POD) | NextPublishing(ネクストパブリッシング)
nextpublishing.jp/book/8958.html
ES2017についてチュートリアルガイド