JSer.info #541 - Windows 10においてのInternet Explorer(IE)の単体のアプリとしてサポートが2022年6月15日で終了されることがアナウンスされました。
- The future of Internet Explorer on Windows 10 is in Microsoft Edge | Windows Experience Blog
- Internet Explorer は Microsoft Edge へ – Windows 10 の Internet Explorer 11 デスクトップアプリは 2022 年 6 月 15 日にサポート終了 - Windows Blog for Japan
- 「Internet Explorer 11 デスクトップ アプリケーションのサポート終了」の発表に関連する FAQ - Windows Blog for Japan
2022年6月15日以降は、IEのデスクトップアプリケーション(iexplore.exe)を利用しようとするとMicrosoft Edge(MSEdge)が代わりに起動します。
MSEdgeにはIEモードが搭載されており、MSEdgeの設定を変更することでIEのレンダリングエンジンであるMSHTML (Trident)が使えるようになるようです。
また、このIEモードではMSEdgeのF12開発者ツールと接続できないため、代わりにIEChooser.exeを使ったデバッグができるようになっています。
このIEモード(MSHTML)のサポート自体は今回のアナウンスとは関係なく、 2029年までサポートされる予定となっています。
WebContainersというブラウザ上でNode.jsのランタイムを動かす仕組みがstackblitzで公開されています。
Node.jsのランタイムをブラウザで動かし、ブラウザ自体をSandboxとしてNode.jsのコードをセキュアに実行するための仕組みとなっています。あくまでブラウザの中で動かす仕組みであるため、ネイティブアドオンは対応せずCORSなどブラウザの制約の中で動作します。
stackblitz/webcontainer-coreではキーコンセプトが解説されています。
Virtual FSとNetworkingを実装し、各プロセスをWorkerとして起動してメッセージングすることでマルチプロセスのサポートしています。POSIXなシェルとしてjshという実装と、npm/yarnクライアントとしてturboという実装を持っています。
現在はオープンソースではありませんが、将来的にコア部分はオープンソースとして公開する予定となっています。
ChromeにおけるUA文字列を扱う navigator.userAgent, navigator.appVersion, navigator.platform を非推奨とするロードマップが更新されています。
Chrome 92で非推奨の警告をだすようになり、段階的にUA文字列から情報を削り、UA文字列化を固定化していく予定のロードマップが公開されています。
navigator.userAgentの代替となる仕組みとして、UA Client Hintsがありロードマップの記事とあわせて、UA Client Hintsへの移行方法についての記事も公開されています。
- Migrate to User-Agent Client Hints
- GoogleChromeLabs/uach-retrofill: This snippet illustrates how to reconstruct the legacy navigator.userAgent string value from the modern navigator.userAgentData values.
JSer.infoをサポートするには
- 😘 知り合いにJSer.infoをおすすめする
- ❤️ GitHub Sponsorsで@azuのスポンサーになる
- 🐦 X(Twitter)で@jser_infoをフォローする
JSer.info Sponsors
JSer.info SponsorsはGitHub SponsorsとしてJSer.infoを支援してくれている方々です。
ヘッドライン
Recoil 0.3.0 | Recoil
recoiljs.org/blog/2021/05/14/0.3.0-released/
Recoil 0.3.0リリース。
RecoilRootにoverrideオプションの追加、selectorにGetCallbackを追加。
次の0.4でsnapshot.retain()していないsnapshotを使うと例外が発生するようになる
The future of Internet Explorer on Windows 10 is in Microsoft Edge | Windows Experience Blog
IE11のデスクトップアプリケーションとしてのサポートは2022年6月15日で終了し、MSEdgeのIEモードで引き続き2029年までサポートする予定。
- Internet Explorer は Microsoft Edge へ – Windows 10 の Internet Explorer 11 デスクトップアプリは 2022 年 6 月 15 日にサポート終了 - Windows Blog for Japan
- 「Internet Explorer 11 デスクトップ アプリケーションのサポート終了」の発表に関連する FAQ - Windows Blog for Japan
Release v7.5.0 · GoogleChrome/lighthouse
github.com/GoogleChrome/lighthouse/releases/tag/v7.5.0
Lighthouse 7.5.0リリース。
Source Mapベースのファイルツリーを可視化するTreemap表示の追加、新しいCLSへの対応を追加など
Node v16.2.0 (Current) | Node.js
nodejs.org/en/blog/release/v16.2.0/
Node v16.2.0リリース。
import.meta.resolveがURLオブジェクトをサポート、Workerが作成された際にtriggerされるworkerイベントをprocessに追加など
Release v10.0.0 · TypeStrong/ts-node
github.com/TypeStrong/ts-node/releases/tag/v10.0.0
TypeScriptのコンパイルをRuntime時に行うts-node 10.0.0リリース。
--script-modeの挙動をデフォルト化し、古い挙動を再現する--cwd-modeを追加。
Node.js 10のサポート終了、--show-configの追加、--transpilerオプションでSWCを使ったtrasnpileに対応など。
またウェブサイトが更新されている。
アーティクル
Chromium Blog: Update on User-Agent String Reduction in Chrome
blog.chromium.org/2021/05/update-on-user-agent-string-reduction.html
ChromeのUser-Agent固定化のロードマップ。
Chrome 92でnavigator.userAgentなどのdeprecated化、reduced UA stringをオプトインで導入、デフォルト化など7段階でのマイグレーションフェーズについて
Introducing Firefox's new Site Isolation Security Architecture - Mozilla Hacks - the Web developer blog
hacks.mozilla.org/2021/05/introducing-firefox-new-site-isolation-security-architecture/
FirefoxのSite Isolationのアーキテクチャについての記事。
eTLDベースのSiteごとにプロセス分け、メモリを相互に分離した状態でリソースをロードすることで、Spectreなどのサイドチャネル攻撃を防止する。
また、サブフレームもトップレベルが異なるSiteなら、別プロセスで読むこむようになっている。
The Humble <img> Element And Core Web Vitals — Smashing Magazine
www.smashingmagazine.com/2021/04/humble-img-element-core-web-vitals/
<img>についてLCP、CLS、FIDのメトリクスに関する最適化の仕方についてのガイド
Introducing WebContainers: Run Node.js natively in your browser
blog.stackblitz.com/posts/introducing-webcontainers/
Node.jsをブラウザで動かすWebContainersについて。
Node.jsのランタイムをブラウザで動かし、ブラウザ自体をSandboxとしてNode.jsのコードをセキュアに実行するための仕組み。
Virtual FSとNetworkingを実装し、各プロセスをWorkerとして起動してメッセージングすることでマルチプロセスのサポートしている。
POSIXなシェルとしてjshという実装と、npm/yarnクライアントとしてturboという実装を持っている
Migrate to User-Agent Client Hints
navigator.userAgentなどがDeprecatedとなり固定化されるため、その代わりとなるUser-Agent Client Hintsについて。
JavaScriptのAPIとしてのnavigator.userAgentDataとnavigator.userAgentData.getHighEntropyValues。
HTTPヘッダUA Client Hintを扱うAccept-CHとSec-CH-UA-*について。
また、Client HintからレガシーなUA文字列を作成するライブラリについてなど
- Chromium Blog: Update on User-Agent String Reduction in Chrome
- GoogleChromeLabs/uach-retrofill: This snippet illustrates how to reconstruct the legacy navigator.userAgent string value from the modern navigator.userAgentData values.
Renaming N-API to Node-API. This post was contributed by the… | by Node.js | May, 2021 | Medium
nodejs.medium.com/renaming-n-api-to-node-api-27aa8ca30ed8
Node.jsのネイティブアドオン用のAPIの名前をN-APIをNode-APIへ変更するという話。
変更のモチベーションについて解説している
サイト、サービス、ドキュメント
オリジナルのJavaScriptライブラリを公開しよう
zenn.dev/yusuke99/books/fcd96342f5cb1b468799
JavaScriptのライブラリをnpmに公開するチュートリアル。
ライブラリの実装とテスト、npmへの公開、GitHub ActionsでのCIからpublish、Scoped Packagesについてなど
ソフトウェア、ツール、ライブラリ関係
argyleink/transition.css: Drop-in CSS transitions
github.com/argyleink/transition.css
いろいろなCSS transitionを集めたCSSライブラリ
DOM Events
DOMイベントの流れをBubbling、Capture、Passiveなどのオプションごとに動きを可視化できるツール
rtk-incubator/rtk-query: Experimental data fetching and caching addon for Redux Toolkit
github.com/rtk-incubator/rtk-query
Redux Toolkitを使うデータ取得と状態管理をするQueryライブラリ。
宣言的なAPIの定義、データの取得、キャッシュやリトライ、Prefetching、React Hooks、Open APIから自動生成などに対応している。
将来的にはRedux Toolkitに同梱することを目標にしている。
ngneat/variabless: JS & CSS - A Match Made in Heaven 💎
JavaScriptからCSS Variablesの定義を含んだCSSを生成するツール
Web worker meets worker threads - threads.js
ブラウザのWeb WorkerとNode.jsのworker_threadsを使ったWorker管理ライブラリ。
async functionとObservablesの対応、thread pools、webpack向けのpluginを持っている
