JSer.info #436 - TypeScript 3.5 RCがリリースされました。
- Announcing TypeScript 3.5 RC | TypeScript
- TypeScript 3.5 Iteration Plan · Issue #30555 · microsoft/TypeScript
- Breaking Changes · microsoft/TypeScript Wiki
型チェックと--incrementalオプションを使ったビルドのパフォーマンス改善がされています。
また、Omitヘルパー型がlib.d.tsに追加、Union型におけるプロパティチェックの改善なども行われています。
破壊的な変更としてGeneric type parameterのデフォルトが{}からunknownへと変更されています。
3.4までは次のようなコードにおけるTは何もextendsしていない場合は{}として解決されていました。
3.5からはTがunknown型として解決されるようになります。
function foo<T>(x: T): [T, string] {
return [x, x.toString()]
// ~~~~~~~~ error! Property 'toString' does not exist on type 'T'.
}
簡単なワークアラウンドとしては明示的にTのデフォルトを{}型にすることです。
function foo<T extends {}>(x: T): [T, string] {
return [x, x.toString()]
}
また、tsconfig.jsonでtarget:es5の場合にObject.keysがプリミティブ型を受け入れないように修正されました。
これは、ES5まではObject.keys(10)のようなコードは例外が発生するのがECMAScriptの仕様だったため、それに合わせる修正です。
一方で、ES2015からはObject.keys(10)は例外が発生しないのがECMAScriptの仕様なので、TypeScriptもそれに合わせています。
それ以外にも細かい破壊的な変更があるので詳しくはBreaking Changesを参照してください。
Accessibility InsightsというウェブサイトやWindowsアプリケーションのアクセシビリティテストツールが公開されています。
ウェブ向けではChromeやmacOS版も公開されたMSEdgeのInside Preview向けのブラウザ拡張が公開されています。
FastPassとAssessmentの2つのシナリオでのアクセシビリティのテストをサポートしていて、自動チェックとシナリオ元にした手動チェックを行えます。
また、Tabキーのフォーカス移動の可視化、カラーテスト、WAI-ARIAのLandmarks表示などアクセシビリティテストの補助機能も用意されています。
次のページで使い方などが解説されているので、興味がある人は見てみるとよさそうです。
JSer.infoをサポートするには
- 😘 知り合いにJSer.infoをおすすめする
- ❤️ GitHub Sponsorsで@azuのスポンサーになる
- 🐦 X(Twitter)で@jser_infoをフォローする
JSer.info Sponsors
JSer.info SponsorsはGitHub SponsorsとしてJSer.infoを支援してくれている方々です。
ヘッドライン
Release v3.14.0 · lerna/lerna
github.com/lerna/lerna/releases/tag/v3.14.0
monorepo管理ツールのlerna 3.14.0リリース。
npm publish時の2要素認証(OTP)のサポート、--conventional-prereleaseと--conventional-graduateのサポートなど
Release v2.7.0 · nuxt/nuxt.js
github.com/nuxt/nuxt.js/releases/tag/v2.7.0
Nuxt.js 2.7.0リリース。
サーバサイドのログもブラウザコンソールに表示されるように、store/ディレクトリのファイル監視の改善など
Announcing TypeScript 3.5 RC | TypeScript
devblogs.microsoft.com/typescript/announcing-typescript-3-5-rc/
TypeScript 3.5 RCリリース。
型チェックとビルドのパフォーマンス改善、Omitヘルパー型を追加、Union型の改善など。
破壊的な変更としてGeneric type parameterのデフォルトが{}からunknownへと変更、target:es5時にObject.keysがプリミティブ型を受け取らないように変更など
V8 release v7.5 · V8
V8 v7.5リリース。
WebAssemblyのコンパイル結果を暗黙的にキャッシュする変更、ECMAScript ProposalのNumeric separatorsを実装。
ネットワークからスクリプトを読み込みながらパースする際に、メインスレッドによってブロックされる問題を解消など
Release Notes for Safari Technology Preview 82 | WebKit
webkit.org/blog/8921/release-notes-for-safari-technology-preview-82/
Safari Technology Preview 82リリース。
Fetch APIのkeepAliveオプションのサポート、Web GPU APIをnavigator.gpuに移動など
Introducing the first Microsoft Edge preview builds for macOS - Microsoft Edge Blog
blogs.windows.com/msedgedev/2019/05/20/microsoft-edge-macos-canary-preview/
MSEdgeのmacOS対応版がInsider Previewでリリースされた
アーティクル
TypeScript 3.0: The unknown Type — Marius Schulz
mariusschulz.com/blog/typescript-3-0-the-unknown-type
TypeScript 3.0で導入されたunknown typeについての解説。
any typeとの違い、unknown typeに対して任意の操作ができない点、unknown typeは型を絞り込んでから使う点について
Faster smarter JavaScript debugging in Firefox DevTools - Mozilla Hacks - the Web developer blog
hacks.mozilla.org/2019/05/faster-smarter-javascript-debugging-in-firefox/
Firefox 67の開発者ツールの改善点について。
ロードパフォーマンスの改善、Break Pointの改善やLog Pointの対応、Web Workerスクリプトとの切り替えを改善、Source Mapを使った細かい表示の改善など
const assertions are the killer new TypeScript feature
blog.logrocket.com/const-assertions-are-the-killer-new-typescript-feature-b73451f35802
TypeScript 3.4で導入されたconst assertionについて。
リテラルの型拡大を防いだり、オブジェクトのプロパティをreadonlyにできるなど
Google Fonts is Adding font-display 🎉—zachleat.com
www.zachleat.com/web/google-fonts-display/
Google Fontsがdisplayパラメータでfont-displayプロパティの指定をサポートしたことについて。
[Web フロントエンド] 状態更新ロジックをフレームワークから独立させる | Kabuku Developers Blog
www.kabuku.co.jp/developers/framework-agnostic-state-modification
immerを使ったステート更新ロジックに分け、Angular、Vue、Reactなどのフレームワーク内に組み込む方法について。
スライド、動画関係
JSでDoSる/ Shibuya.XSS techtalk #11 - Speaker Deck
speakerdeck.com/masatokinugawa/shibuya-dot-xss-techtalk-number-11
JavaScriptで例外が発生するパターンやNode.jsでクラッシュするケーススタディについてのスライド
サイト、サービス、ドキュメント
DasSur.ma – Raw WebAssembly
WebAssemblyがstack-based VMであるとはどういうことかを見ていく記事。
WebAssembly text形式であるwatを手書きして、WebAssemblyでのモジュールの定義、関数の定義と呼び出し、メモリの確保、wasmの読み込みについて。
Accessibility Insights
アクセシビリティのチェックを補助するブラウザ拡張。
アクセシビリティのチェック項目を可視化したり、FastPassとAssessmentの2つのシナリオでのテストをサポートしている。
- microsoft/accessibility-insights-web: Accessibility Insights for Web
- Introduction to Accessibility Insights for Web - YouTube
Inside Microsoft’s surprise decision to work with Google on its Edge browser - The Verge
www.theverge.com/2019/5/6/18527550/microsoft-chromium-edge-google-history-collaboration
MSEdgeがChromiumベースになった背景について。
最初はEdgeの利用率、最新の機能の実装遅れなどの問題を解決する選択肢の一つだったが、組織改編、Septagonというプロトタイプ、切り替えの公表から実際の作業に入った話など
ソフトウェア、ツール、ライブラリ関係
Reakit
アクセシビリティを考慮したReactコンポーネントライブラリ。
React Hooksへの対応や基礎的なコンポーネントを提供し、コンポーネントを組み合わせ利用できるようにすることを目的にしている。
esxjs/esx: Like JSX, but native and fast
JSXライクな構文をサポートしたTagged Templateライブラリ。
またReactをesxの構文に変換するBabelプラグインもあり、ReactのSSRテンプレートエンジンとしても利用できる
