JSer.info #621 - Electron 22.0.0がリリースされました。

Electron 22.0.0 | Electron

Chromium 108、Node.js 16.17.1、V8 10.8へのアップデート、UtilityProcessモジュールの追加、new-windowイベントの非推奨化などの変更が含まれています。

また、Chromium 109でWindows 7/8/8.1のサポートが終了するため、Electronもこれに合わせるようです。
そのため、Windows 7/8/8.1をサポートする最後のElectronバージョンとなります。

Sunsetting support for Windows 7 / 8/8.1 in early 2023 - Google Chrome Community

今週はウェブパフォーマンスやJavaScriptのパフォーマンスについての記事が多いです。

Image Formats for the Web | DebugBearはGIFからAVIFまで色々ある画像のパフォーマンスについてまとめられています。
また、Prerender pages in Chrome for instant page navigations - Chrome Developersは、Chrome 108に新しく実装されたprerenderの仕組みについて紹介されています。

Speeding up the JavaScript ecosystem - one library at a timeという記事では、著名なツールでどのような部分に遅くなる処理があるのかを紹介しています。

その他にはWeb Performance Calendar » 2022が今年も開催されているので、ウェブに関するパフォーマンスの記事が多くなっています。

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

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

JSer.info Sponsors

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

ヘッドライン

Electron 22.0.0 | Electron

www.electronjs.org/blog/electron-22-0

Electron ReleaseNote

Electron 22.0.0リリース。
Chromium 108、Node.js 16.17.1、V8 10.8へのアップデート、UtilityProcessモジュールの追加、new-windowイベントの非推奨化など。
Windows 7/8/8.1をサポートする最後のElectronバージョンとなる。

Release 5.0.0 · primus/eventemitter3

github.com/primus/eventemitter3/releases/tag/5.0.0

JavaScript library ReleaseNote

eventemitter3 5.0.0リリース。
Node.js ESMのサポートなど

ECMAScript proposal updates @ 2022-11 | ECMAScript Daily

ecmascript-daily.github.io/ecmascript/2022/12/05/ecmascript-proposal-update

ECMAScript proposal news

2022年11月に行われたTC39 MeetingによってStatusが変化したECMAScript Proposalのまとめ。

New in Chrome 108 - Chrome Developers

developer.chrome.com/blog/new-in-chrome-108/

Chrome ReleaseNote

Chrome 108の変更点について。
viewportのunitとしてdvh/lvh/svhを追加、Variable fontsのCOLRv1をサポート。
FileSystemSyncAccessHandleのAPIを同期メソッドに変更、Permissions PolicyのOrigin指定に*(wildcard)を利用できるようになるなど

アーティクル

How TypeScript 4.9 `satisfies` Your Prisma Workflows

www.prisma.io/blog/satisfies-operator-ur8ys8ccq7zb

TypeScript article

TypeScript 4.9のsatisfies operatorの使い方についての記事。
PrismaやZodと合わせた使い方について

Sass製SVG爆速表示ライブラリのご紹介 - dwango on GitHub

dwango.github.io/articles/2022-12_nicolive_svg/

CSS SVG Cargo

CSSを使ってSVGを切り替える方法とそれを実装したライブラリについて。
CSSのmask-imageを使った方法とanimationstartで切り替える方法についての比較

Image Formats for the Web | DebugBear

www.debugbear.com/blog/image-formats

Image performance article

ウェブ向けの画像フォーマットとどれを使うべきかについて。
GIF/PNG/JPG/WebP/AVIF/SVGそれぞれの特性と推奨事項。また、AVIFは非可逆圧縮と可逆圧縮どちらもサポートしているが、可逆圧縮の結果はあまり良くない点についてなど

Migrating from Vue 2 to Svelte

escape.tech/blog/from-vue2-to-svelte/

Vue Svelte article

Vue 2からSvelteKitに移行したという話。

Working with Zustand | TkDodo's blog

tkdodo.eu/blog/working-with-zustand

JavaScript React article

React向けのステート管理ライブラリであるZustandについてのTips。
パフォーマンスに関するTips、アクションとステートの分離、アクションをsetterではなくeventとして扱う、Storeのスコープを小さく保つなど

Prerender pages in Chrome for instant page navigations - Chrome Developers

developer.chrome.com/en/blog/prerender-pages/

Chrome performance article

Chromeの新しいprerenderについて。
アドレスバーでURLを入力する場合も信頼度に基づいてPrerenderを投機的に行う。
またSpeculation Rules APIでのprerenderのルール定義、prerenderをサーバ側で無効化する方法、prerenderされたかを判定する方法についてなど