JSer.info #369 - テストフレームワークのAVA 1.0.0βが公開されています。
Babel 7βを利用するようになり、その影響でpowerAssert
など既存の変換オプションなどが変更されています。
babel
とcompileEnhancements
オプションで統一的に管理されるようになっていて、どちらもfalse
にすればBabelを使った変換を一切行わないようになりました。
{
"ava": {
"babel": false,
"compileEnhancements": false
}
}
また、test
関数がテストタイトルとなるものが必須となり、次のように名前のない関数だけを渡したtest
は利用できなくなりました。
// エラー
test(t => t.pass());
AVA 1.0.0βはava@next
で試すことができます。
npm install ava@next
TypeScript 2.7がリリースされました。
strict
の挙動にクラスのフィールドの初期化チェックを厳密に行うstrictPropertyInitialization
の追加やDefinite assignment assertions(!
)の追加、--esModuleInterop
を追加しdefault exportするcommonjsとのinteropの改善などが行われています。
詳しくは次の記事で解説されています。
MDN browser compatibility data: Taking the guesswork out of web compatibility – Mozilla Hacks – the Web developer blogという記事ではMDNが表示しているブラウザの互換性データについて書かれています。
MDNの機能のリファレンスページにはその機能をサポートしてるブラウザやバージョンの一覧が表示されています。
このデータはmdn-browser-compat-dataというnpmパッケージからも利用できるようになっています。
- mdn/browser-compat-data: This repository contains compatibility data for Web technologies as displayed on MDN
- データを管理するGitHubリポジトリ
この記事ではこれらのデータを活用方法などについて紹介しています。
JSer.infoをサポートするには
- 😘 知り合いにJSer.infoをおすすめする
- ❤️ GitHub Sponsorsで@azuのスポンサーになる
- 🐦 X(Twitter)で@jser_infoをフォローする
JSer.info Sponsors
JSer.info SponsorsはGitHub SponsorsとしてJSer.infoを支援してくれている方々です。
ヘッドライン
Node v9.5.0 (Current) | Node.js
nodejs.org/en/blog/release/v9.5.0/
Node v9.5.0リリース。
performance.clearEntries(name)
のサポート、cluster.settings
にcwd
オプションの追加など
Announcing TypeScript 2.7 | TypeScript
blogs.msdn.microsoft.com/typescript/2018/01/31/announcing-typescript-2-7/
TypeScript 2.7リリース。
クラスプロパティのStrictオプションの追加、Definite assignment assertions(!
)の追加、--esModuleInterop
を追加しdefault exportするcommonjsとのinteropの改善。
Tuple、in
、instanceof
、オブジェクトリテラルの型改善など
Release 1.0.0-beta.1 · avajs/ava
github.com/avajs/ava/releases/tag/v1.0.0-beta.1
AVA 1.0.0β1リリース。
Babel 7βを利用するように、test
がテストタイトルを必須に、powerAssert
の無効オプションは、babel
とcompileEnhancements
オプションで管理されるように変更など
V8 JavaScript Engine: V8 release v6.5
v8project.blogspot.com/2018/02/v8-release-65.html
V8 6.5リリース。
Unstruted code modeがデフォルトで有効化、WebAssemblyのStreaming compilationのサポート、Arrayメソッドの改善、疎の配列の改善など
アーティクル
Bootstrap 4.0 Release: What’s New?
auth0.com/blog/whats-new-in-bootstrap4/
BootStrap 4.0の変更点についての解説。
Stimulus 1.0: A modest JavaScript framework for the HTML you already have
Stimulus 1.0リリース。
RailsのTurbolinksと共存して動作できるJavaScriptフレームワーク。
HTMLなテンプレートとJavaScriptなコントローラーを組み合わせてアプリケーションを作る。
Automatic visual diffing with Puppeteer – Monica Dinculescu
meowni.ca/posts/2017-puppeteer-tests/
Puppeteerを使ったVisual Diffテストについて。
スクリーンショットをPixelmatchで比較し、画像のDiffを元にテストする話
Introducing React Easy State | @RisingStack
blog.risingstack.com/introducing-react-easy-state/
ES Proxyを使ったステート管理ライブラリについて
Debugging JavaScript With A Real Debugger You Did Not Know You Already Have — Smashing Magazine
www.smashingmagazine.com/2018/02/javascript-firefox-debugger/
Firefoxの開発者ツールの紹介とdebugger.html
について。
Jestなどを使わずにスナップショットテストを書く | Web Scratch
efcl.info/2018/02/02/snapshot-test/
特別なライブラリを使わずにスナップショットテストを実装する方法について。
Testing your npm package before releasing it using Verdaccio + ngrok
blog.strapi.io/testing-npm-package-before-releasing-it-using-verdaccio-and-ngrok/
npmパッケージをpublishする前にテスト方法について。
Private npm registryであるVerdaccioにpublishして、localhostトンネルであるngrokを使ってテストするという話
Debugging CSS Performance with Chrome’s Profiling Tools - Ada Developers Academy
adadevacademy.tumblr.com/post/170121818942/debugging-css-performance-with-chromes-profiling
CSSのパフォーマンス問題について。
Reactの問題かと疑って色々試した結果、CSSのレンダリングの問題であったケースについて。
インラインCSS、gradientを直すことで改善されたが、開発者ツールではこの問題がどう見えていたかについて
Introducing Node Clinic - A performance toolkit for Node.js developers | nearForm
www.nearform.com/blog/introducing-node-clinic-a-performance-toolkit-for-node-js-developers/
Node.jsアプリのパフォーマンスモニタリングツールであるClinicについて。
ダッシュボードでCPU、メモリ、イベントループの遅延などを見ることができる
How JavaScript works: The building blocks of Web Workers + 5 cases when you should use them
WebWorkerの使い方やユースケースについて
サイト、サービス、ドキュメント
MDN browser compatibility data: Taking the guesswork out of web compatibility – Mozilla Hacks – the Web developer blog
hacks.mozilla.org/2018/02/mdn-browser-compatibility-data/
MDNが利用してるブラウザのサポート状況をまとめたデータがnpmパッケージとして利用できるようになった。
このデータの使い方やサイトのサポートブラウザの可視化する拡張などについて
ソフトウェア、ツール、ライブラリ関係
thejameskyle/glow: Make your Flow errors GLOW
FlowのエラーをCodeFrameにして表示、Watchモード、globで対象のフィルターを行えるツール
FullHuman/purgecss: Remove unused css
使ってないCSSを削除するツール。
コンテンツ(HTML、JSなど)とCSSを渡し、不要となったCSSを削除できる。