JSer.info #623 - Vite 4.0がリリースされました。

Vite 4.0 is out! | Vite

SWCをサポートする@vitejs/plugin-react-swcを追加、デフォルトでES2020形式で出力するように変更、CSSを文字列としてインポートする方法の変更などの変更が含まれています。

SvelteベースのフレームワークであるSvelteKit 1.0がリリースされました。

Announcing SvelteKit 1.0

α版からの変更点は次のマイグレーションガイドにまとめられています。

Migration guide · Discussion #5774 · sveltejs/kit

Node v19.3.0がリリースされました。

Node v19.3.0 (Current) | Node.js

Node v19.3.0では、npm 9系となるnpm 9.2.0が同梱されています。
npm 8から9はメジャーアップデートなので、破壊的な変更を含んでいます。

npm v9.0.0 released | GitHub Changelog

一方で、Node.jsに同梱されるnpmをアップデートする際にどうするかについて、次のIssueで議論されました。

Plans for npm 9 · Issue #778 · nodejs/Release

議論した結果、次のようなガイドラインが作成され、このガイドラインを満たしているなら、Node.jsのメジャーアップデートなしに同梱するnpmをメジャーアップデートするという結論になったようです。
具体的にはNode.jsのエコシステムをテストするcitgmがfailしない、package-lock.jsonを変更しないなどの要件が含まれています。

Integrating with node · npm/cli Wiki

このガイドラインに則り、2023年1月18日にnpm 9をNode.js 18へもバックポートする予定となっています。

Wednesday Jan. 18th (~6 weeks after node@19 backport)
A PR will be opened to backport [email protected] in node@18
https://github.blog/changelog/2022-10-24-npm-v9-0-0-released/

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

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

JSer.info Sponsors

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

ヘッドライン

jQuery 3.6.2 Released! | Official jQuery Blog

blog.jquery.com/2022/12/13/jquery-3-6-2-released/

jQuery ReleaseNote

jQuery 3.6.2リリース。
CSS Variablesのバグ修正、<template>に対する.contains()の修正。
CSSセレクタの:has()の仕様の問題でjQuery 1.3以降に影響があったが、仕様とChromeが修正された。

Vite 4.0 is out! | Vite

vitejs.dev/blog/announcing-vite4.html

vite ReleaseNote

Vite 4.0リリース。
SWCをサポートする@vitejs/plugin-react-swcを追加、ES2020で出力するように変更、CSSを文字列としてインポートする方法の変更など

Announcing SvelteKit 1.0

svelte.dev/blog/announcing-sveltekit-1.0

Svelte ReleaseNote

SvelteKit 1.0リリース。

Migration guide · Discussion #5774 · sveltejs/kit

Storybook 7.0 beta

storybook.js.org/blog/7-0-beta/

JavaScript debug Tools ReleaseNote

Storybook 7.0 betaリリース。
webpack4、IE11、Node.js 14のサポート終了、storiesOf APIをデフォルトで無効化など。
CSF3のデフォルト化、Viteのサポート、Test runnerとCode Coverageのサポートなど

Storybook 7 migration guide

Release v1.29.0 · microsoft/playwright

github.com/microsoft/playwright/releases/tag/v1.29.0

playwright ReleaseNote

playwright v1.29.0リリース。
route.fetch()の追加、locator.all()の追加、expect().toPassの追加。
テスト失敗時にページ全体のスクリーンショットを撮るfullPageオプションの追加など

Node v19.3.0 (Current) | Node.js

nodejs.org/en/blog/release/v19.3.0/

node.js ReleaseNote

Node.js v19.3.0リリース。
Node.jsでのnpmのアップデートにおける"Major Update"を定義し、npm 9.2.0にアップデート。

Integrating with node · npm/cli Wiki

Release v0.16.10 · evanw/esbuild

github.com/evanw/esbuild/releases/tag/v0.16.10

JavaScript Tools ReleaseNote

esbuild v0.16.10リリース。
--legal-commentsのデフォルト値を元に戻し、ライセンスとそのライセンスコメントの起源となるファイル名をコメントに含めるように変更。

アーティクル

Find the most expensive CSS selectors

devtoolstips.org/tips/en/find-expensive-selectors/

CSS performance article

MSEdgeのDevToolsで、CSSセレクタの処理時間やマッチ回数を見る方法について

Help choose the syntax for CSS Nesting | WebKit

webkit.org/blog/13607/help-choose-from-options-for-css-nesting-syntax/

CSS アンケート article

CSSのネスト構文のProposalでどの構文がわかりやすいかというアンケートが実施されている

Web Performance Calendar » Web Performance APIs Appreciation Post

calendar.perfplanet.com/2022/web-performance-apis-appreciation-post/

JavaScript browser performance article

新しめのウェブパフォーマンスAPIについての紹介記事。
Render blocking status、Offscreen Canvas、OfflineAudioContext。
Async Image Decoding、Image.decode()、loading=lazy、fetchpriority、103 Early Hintsなどについて