2023-10-31のJS: Next.js 14、MSW 2、Node.js 21.1.0

_i18n/ja/_posts/2023/2023-10-31-next.js-14-msw-2-node.js-21.1.0.md

@@ -0,0 +1,228 @@
+---
+title: "2023-10-31のJS: Next.js 14、MSW 2、Node.js 21.1.0"
+author: "azu"
+layout: post
+date: 2023-10-31T13:19:42.271Z
+category: JSer
+tags:
+- Next.js
+- nodejs
+- vite
+- parcel
+- webpack
+
+---
+
+JSer.info #667 - Next.js 14がリリースされました。
+
+- [Next.js 14 | Next.js](https://nextjs.org/blog/next-14)
+- [Release v14.0.0 · vercel/next.js](https://github.com/vercel/next.js/releases/tag/v14.0.0)
+
+Node.js 16のサポート終了、`next export`コマンドを非推奨化、`next/image`の`domains`オプションを非推奨化などの変更が含まれています。
+また、Server ActionのStable化、Metadata APIの改善が含まれています。
+実験的な機能として`<Suspense>`を使ったPartial Prerenderingのサポートが追加されています。
+
+今回のリリースに合わせて、Next.jsのチュートリアルも新しくものが公開されています。
+
+- [Next.js by Vercel - The React Framework | Next.js by Vercel - The React Framework](https://nextjs.org/learn)
+
+----
+
+HTTPリクエストのモックライブラリであるMSW 2.0がリリースされています。
+
+- [Introducing MSW 2.0 - Mock Service Worker](https://mswjs.io/blog/introducing-msw-2.0)
+- [Release v2.0.0 · mswjs/msw](https://github.com/mswjs/msw/releases/tag/v2.0.0)
+
+Node.js 16のサポート終了、APIのシグネチャーの変更、ブラウザ向けのAPIを`msw/browser`へ移動などの破壊的な変更が含まれています。
+APIの変更範囲は多いですが、マイグレーションガイドも合わせて公開されています。
+
+- [1.x → 2.x - Mock Service Worker](https://mswjs.io/docs/migrations/1.x-to-2.x)
+
+また、`ReadableStream`/`FormData`のモックをサポートなども追加されています。
+
+----
+
+Node.js 21.1.0がリリースされました。
+
+- [Node v21.1.0 (Current) | Node.js](https://nodejs.org/en/blog/release/v21.1.0)
+
+Ambiguous fileがESMかを判定する`--experimental-detect-module`フラグの追加されています。
+詳しくは、次の記事で解説しています。
+
+- [Deep Dive: Node.jsのESMデフォルト化への道 - JSer.info](https://jser.info/2023/10/18/node.js-roadmap-esm-by-default/)
+
+また、`vm.Script`のバグの修正が修正されています。
+この問題はNode.js 16.11.0+以降で起きていて、主にJestでメモリが確保され続けるためクラッシュする問題が発生してました。
+
+- [[Bug]: Memory consumption issues on Node JS 16.11.0+ · Issue #11956 · jestjs/jest](https://github.com/jestjs/jest/issues/11956)
+
+
+----
+
+{% include inline-support.html %}
+
+----
+
+<h1 class="site-genre">ヘッドライン</h1>
+
+----
+
+## Next.js 14 | Next.js
+[nextjs.org/blog/next-14](https://nextjs.org/blog/next-14 "Next.js 14 | Next.js")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">Next.js</span> <span class="jser-tag">ReleaseNote</span></p>
+
+Next.js 14リリース。
+Node.js 16のサポート終了、`next export`コマンドを非推奨化、`next/image`の`domains`オプションを非推奨化。
+Server ActionのStable化、Metadata APIの改善。
+実験的な機能として`<Suspense>`を使ったPartial Prerenderingのサポートなど
+
+- [Release v14.0.0 · vercel/next.js](https://github.com/vercel/next.js/releases/tag/v14.0.0 "Release v14.0.0 · vercel/next.js")
+
+----
+
+## Astro 3.4: Page Partials | Astro
+[astro.build/blog/astro-340/](https://astro.build/blog/astro-340/ "Astro 3.4: Page Partials | Astro")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">astro</span> <span class="jser-tag">ReleaseNote</span></p>
+
+Astro 3.4リリース。
+page componentをpartial pageとして利用できる`partial`オプションをサポート、画像最適化のパフォーマンス改善。
+実験的な機能としてDev Overlayを追加など
+
+- [Release astro@3.4.0 · withastro/astro](https://github.com/withastro/astro/releases/tag/astro%403.4.0 "Release astro@3.4.0 · withastro/astro")
+
+----
+
+## Release Release v1.6.0 · axios/axios
+[github.com/axios/axios/releases/tag/v1.6.0](https://github.com/axios/axios/releases/tag/v1.6.0 "Release Release v1.6.0 · axios/axios")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">HTTP</span> <span class="jser-tag">library</span> <span class="jser-tag">ReleaseNote</span> <span class="jser-tag">security</span></p>
+
+axios v1.6.0リリース。
+`X-XSRF-TOKEN`というCookieが設定されている時に、`withCredentials`オプションが有効だと、別オリジンに対するリクエストにも`X-XSRF-TOKEN`の値が送信される脆弱性の修正
+
+
+----
+
+## Release v8.10.0 · pnpm/pnpm
+[github.com/pnpm/pnpm/releases/tag/v8.10.0](https://github.com/pnpm/pnpm/releases/tag/v8.10.0 "Release v8.10.0 · pnpm/pnpm")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">pnpm</span> <span class="jser-tag">ReleaseNote</span></p>
+
+pnpm v8.10.0リリース。
+`supportedArchitectures`で複数のアーキテクチャを指定できるように。
+ホスト環境とDocker環境に両方のアーキテクチャのバイナリをインストール際などに利用できる。
+
+
+----
+
+## Introducing MSW 2.0 - Mock Service Worker
+[mswjs.io/blog/introducing-msw-2.0](https://mswjs.io/blog/introducing-msw-2.0 "Introducing MSW 2.0 - Mock Service Worker")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">testing</span> <span class="jser-tag">library</span> <span class="jser-tag">ReleaseNote</span></p>
+
+MSW 2.0リリース。
+Node.js 16のサポート終了、APIのシグネチャーの変更、ブラウザ向けのAPIを`msw/browser`へ移動。
+`ReadableStream`/`FormData`のモックをサポートなど
+
+- [Release v2.0.0 · mswjs/msw](https://github.com/mswjs/msw/releases/tag/v2.0.0 "Release v2.0.0 · mswjs/msw")
+- [1.x → 2.x - Mock Service Worker](https://mswjs.io/docs/migrations/1.x-to-2.x "1.x → 2.x - Mock Service Worker")
+
+----
+
+## Node v21.1.0 (Current) | Node.js
+[nodejs.org/en/blog/release/v21.1.0](https://nodejs.org/en/blog/release/v21.1.0 "Node v21.1.0 (Current) | Node.js")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">nodejs</span> <span class="jser-tag">ReleaseNote</span></p>
+
+Node.js v21.1.0リリース。
+Ambiguous fileがESMかを判定する`--experimental-detect-module`フラグの追加、Jestでのメモリリークの原因となっていた`vm.Script`のバグの修正など
+
+- [Deep Dive: Node.jsのESMデフォルト化への道 - JSer.info](https://jser.info/2023/10/18/node.js-roadmap-esm-by-default/ "Deep Dive: Node.jsのESMデフォルト化への道 - JSer.info")
+- [\[Bug\]: Memory consumption issues on Node JS 16.11.0+ · Issue #11956 · jestjs/jest](https://github.com/jestjs/jest/issues/11956 "\[Bug\]: Memory consumption issues on Node JS 16.11.0+ · Issue #11956 · jestjs/jest")
+
+----
+
+## Release v30.0.0-alpha.1 · jestjs/jest
+[github.com/jestjs/jest/releases/tag/v30.0.0-alpha.1](https://github.com/jestjs/jest/releases/tag/v30.0.0-alpha.1 "Release v30.0.0-alpha.1 · jestjs/jest")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">jest</span> <span class="jser-tag">ReleaseNote</span></p>
+
+Jest v30.0.0-alpha.1リリース。
+`mts`/`cts`をデフォルトでサポート、fake timerの改善、SnapshotでError Causeをサポート、Prettier 3のサポートなど
+
+
+----
+<h1 class="site-genre">アーティクル</h1>
+
+----
+
+## JavaScriptビルドツールの整理 各ツールの機能と依存関係
+[zenn.dev/nakaakist/articles/86457bf2908379](https://zenn.dev/nakaakist/articles/86457bf2908379 "JavaScriptビルドツールの整理 各ツールの機能と依存関係")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">vite</span> <span class="jser-tag">parcel</span> <span class="jser-tag">webpack</span> <span class="jser-tag">rspack</span> <span class="jser-tag">Next.js</span> <span class="jser-tag">bundler</span> <span class="jser-tag">article</span></p>
+
+Vite/Parcel/webpack/Rspack/Turbopack/Next.js/Rollup/esbuild/SWC/Bun/Babel/Terser の特徴と依存関係について。
+
+
+----
+
+## Deprecation of formatting rules - ESLint - Pluggable JavaScript Linter
+[eslint.org/blog/2023/10/deprecating-formatting-rules/](https://eslint.org/blog/2023/10/deprecating-formatting-rules/ "Deprecation of formatting rules - ESLint - Pluggable JavaScript Linter")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">ESLint</span> <span class="jser-tag">article</span></p>
+
+ESLint v8.53.0でスタイル系のルール(スペースやセミコロンなどを扱うルール)は、非推奨となる。
+マイグレーション先としてスタイル系のルールをメンテナンスするESLint StylisticやPrettierなどのツールの利用を推奨している。
+
+- [ESLint Stylistic | ESLint Stylistic](https://eslint.style/ "ESLint Stylistic | ESLint Stylistic")
+
+----
+
+## Announcing WinterJS
+[wasmer.io/posts/announcing-winterjs-service-workers](https://wasmer.io/posts/announcing-winterjs-service-workers "Announcing WinterJS")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">WebAssembly</span> <span class="jser-tag">ServiceWorker</span> <span class="jser-tag">article</span></p>
+
+WinterCG仕様に準拠したJavaScript Runtime。
+SpiderMonkeyをRuntimeとして使い、Service Workers APIを実装している。
+WasmerのWASIX準拠にしている。
+
+- [wasmerio/winterjs: Winter is coming... ❄️](https://github.com/wasmerio/winterjs "wasmerio/winterjs: Winter is coming... ❄️")
+
+----
+
+## サードパーティ Cookie の廃止に向けた準備 - Chrome for Developers
+[developer.chrome.com/ja/blog/cookie-countdown-2023oct/](https://developer.chrome.com/ja/blog/cookie-countdown-2023oct/ "サードパーティ Cookie の廃止に向けた準備 - Chrome for Developers")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">Chrome</span> <span class="jser-tag">article</span></p>
+
+Chromeの3rd party Cookieの廃止と代替Proposalについて
+
+
+----
+<h1 class="site-genre">スライド、動画関係</h1>
+
+----
+
+## JavaScript JIT compiler - YouTube
+[www.youtube.com/playlist?list&#x3D;PLMOpZvQB55bcTsXzRcBjHJJb52OGWwNjr](https://www.youtube.com/playlist?list=PLMOpZvQB55bcTsXzRcBjHJJb52OGWwNjr "JavaScript JIT compiler - YouTube")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">C++</span> <span class="jser-tag">video</span></p>
+
+LadybirdのJavaScriptエンジンであるLibJSにJITを実装していく動画シリーズ。
+
+- [serenity/Userland/Libraries/LibJS at master · SerenityOS/serenity](https://github.com/SerenityOS/serenity/tree/master/Userland/Libraries/LibJS "serenity/Userland/Libraries/LibJS at master · SerenityOS/serenity")
+
+----
+
+## Vue Fes Japan 2023 資料 X ポストまとめ
+[zenn.dev/punkshiraishi/scraps/bf3829dc79466b](https://zenn.dev/punkshiraishi/scraps/bf3829dc79466b "Vue Fes Japan 2023 資料 X ポストまとめ")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">Vue</span> <span class="jser-tag">Conference</span> <span class="jser-tag">slide</span></p>
+
+Vue Fes Japan 2023のスライドまとめ
+
+- [Vue Fes Japan 2023](https://vuefes.jp/2023/ "Vue Fes Japan 2023")
+
+----
+<h1 class="site-genre">ソフトウェア、ツール、ライブラリ関係</h1>
+
+----
+
+## joshmarinacci/node-pureimage: Pure JS implementation of the HTML Canvas 2D drawing API
+[github.com/joshmarinacci/node-pureimage](https://github.com/joshmarinacci/node-pureimage "joshmarinacci/node-pureimage: Pure JS implementation of the HTML Canvas 2D drawing API")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">nodejs</span> <span class="jser-tag">JavaScript</span> <span class="jser-tag">library</span></p>
+
+Pure JavaScriptなNode.js向けCanvas APIの実装ライブラリ。
+
+
+----