|
| 1 | +--- |
| 2 | +title: "2025-04-27のJS: Node v22.15.0、Reactの実験的な機能、Node.jsとV8 GC" |
| 3 | +author: "azu" |
| 4 | +layout: post |
| 5 | +date: 2025-04-27T02:43:58.849Z |
| 6 | +category: JSer |
| 7 | +tags: |
| 8 | +- nodejs |
| 9 | +- React |
| 10 | +- pnpm |
| 11 | +- css |
| 12 | +- performance |
| 13 | + |
| 14 | +--- |
| 15 | + |
| 16 | +JSer.info #733 - Node.js v22.15.0がリリースされました。 |
| 17 | + |
| 18 | +- [Node.js — Node v22.15.0 (LTS)](https://nodejs.org/en/blog/release/v22.15.0) |
| 19 | + |
| 20 | +`assert.partialDeepStrictEqual()`や`module.registerHooks()`などの新しいAPIが追加されました。また、`util.diff()`の追加やzstdのサポートなども含まれています。 |
| 21 | + |
| 22 | +--- |
| 23 | + |
| 24 | +Reactチームが実験的な機能について紹介する記事を公開しました。 |
| 25 | + |
| 26 | +- [React Labs: View Transitions, Activity, and more – React](https://react.dev/blog/2025/04/23/react-labs-view-transitions-activity-and-more) |
| 27 | + |
| 28 | +`<ViewTransition>`、`addTransitionType()`、`<Activity>`などの新しい実験的なAPIの紹介が含まれています。 |
| 29 | +また、DevToolsでのPerformance Profilerの改善や依存のないuseEffect、React Compilerなどの開発中の機能についても言及されています。 |
| 30 | + |
| 31 | +--- |
| 32 | + |
| 33 | +Node.jsとV8のGCに関する解説記事が公開されました。 |
| 34 | + |
| 35 | +- [Boost Node.js with V8 GC Optimization](https://blog.platformatic.dev/optimizing-nodejs-performance-v8-memory-management-and-gc-tuning) |
| 36 | + |
| 37 | +V8の世代別GCの仕組みや、Scavengeによる高速なGC処理、semi-spaceのサイズ調整によるメモリチューニングなど書かれています。 |
| 38 | + |
| 39 | +---- |
| 40 | + |
| 41 | +## PR |
| 42 | + |
| 43 | +[JavaScript Primer](https://jsprimer.net/)のES2025の対応を手伝ってくれるContributorとSponsorを募集しています。 |
| 44 | +毎年6月末にECMAScriptの正式公開に合わせて、今年のアップデートをjsprimerに反映していく作業をしていく予定です。 |
| 45 | + |
| 46 | +- [JavaScript PrimerのES2025対応を手伝ってくれるContributorとSponsorを募集しています | Web Scratch](https://efcl.info/2025/04/25/jsprimer-es2025-proposal/) |
| 47 | + |
| 48 | +---- |
| 49 | + |
| 50 | +{% include inline-support.html %} |
| 51 | + |
| 52 | +---- |
| 53 | + |
| 54 | +<h1 class="site-genre">ヘッドライン</h1> |
| 55 | + |
| 56 | +---- |
| 57 | + |
| 58 | +## Release v1.52.0 · microsoft/playwright |
| 59 | +[github.com/microsoft/playwright/releases/tag/v1.52.0](https://github.com/microsoft/playwright/releases/tag/v1.52.0 "Release v1.52.0 · microsoft/playwright") |
| 60 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">playwright</span> <span class="jser-tag">ReleaseNote</span></p> |
| 61 | + |
| 62 | +playwright v1.52.0リリース。 |
| 63 | +破壊的な変更として`page.route()`で`?`はwildcardとして扱わないように変更、`route.continue()`で`Cookie`ヘッダを上書きできないように変更。 |
| 64 | +`expect(locator).toContainClass()`の追加、Aria Snapshotの更新。 |
| 65 | +プロジェクトごとに`workers`を設定できるように、`failOnFlakyTests`オプションの追加。 |
| 66 | + |
| 67 | + |
| 68 | +---- |
| 69 | + |
| 70 | +## ECMAScript proposal updates @ 2025-04 | ECMAScript Daily |
| 71 | +[ecmascript-daily.github.io/ecmascript/2025/04/19/ecmascript-proposal-update](https://ecmascript-daily.github.io/ecmascript/2025/04/19/ecmascript-proposal-update "ECMAScript proposal updates @ 2025-04 | ECMAScript Daily") |
| 72 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">ECMAScript</span> <span class="jser-tag">proposal</span> <span class="jser-tag">news</span></p> |
| 73 | + |
| 74 | +2025年4月のTC39ミーティングでのECMAScript ProposalのStatus変更のまとめ。 |
| 75 | +Record & Tupleがwithdrawnとなった。 |
| 76 | + |
| 77 | + |
| 78 | +---- |
| 79 | + |
| 80 | +## Release @fastify/react@1.0.0 · fastify/fastify-vite |
| 81 | +[github.com/fastify/fastify-vite/releases/tag/react-v1.0.0 ](https://github.com/fastify/fastify-vite/releases/tag/react-v1.0.0 "Release @fastify/[email protected] · fastify/fastify-vite") |
| 82 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">nodejs</span> <span class="jser-tag">React</span> <span class="jser-tag">ReleaseNote</span></p> |
| 83 | + |
| 84 | +@fastify/react 1.0.0リリース。 |
| 85 | + |
| 86 | + |
| 87 | +---- |
| 88 | + |
| 89 | +## Node.js — Node v22.15.0 (LTS) |
| 90 | +[nodejs.org/en/blog/release/v22.15.0](https://nodejs.org/en/blog/release/v22.15.0 "Node.js — Node v22.15.0 (LTS)") |
| 91 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">nodejs</span> <span class="jser-tag">ReleaseNote</span></p> |
| 92 | + |
| 93 | +Node.js v22.15.0リリース。 |
| 94 | +`assert.partialDeepStrictEqual()`の追加、` module.registerHooks()`の追加、`util.diff()`の追加、zstdのサポートなど |
| 95 | + |
| 96 | + |
| 97 | +---- |
| 98 | + |
| 99 | +## Release pnpm 10.9 · pnpm/pnpm |
| 100 | +[github.com/pnpm/pnpm/releases/tag/v10.9.0](https://github.com/pnpm/pnpm/releases/tag/v10.9.0 "Release pnpm 10.9 · pnpm/pnpm") |
| 101 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">pnpm</span> <span class="jser-tag">ReleaseNote</span></p> |
| 102 | + |
| 103 | +pnpm v10.9.0リリース。 |
| 104 | +`pnpm add jsr:<pkg_name>`でJSRをサポート、`dangerouslyAllowAllBuilds`オプションを追加 |
| 105 | + |
| 106 | + |
| 107 | +---- |
| 108 | + |
| 109 | +## Release Release v1.9.0 · axios/axios |
| 110 | +[github.com/axios/axios/releases/tag/v1.9.0](https://github.com/axios/axios/releases/tag/v1.9.0 "Release Release v1.9.0 · axios/axios") |
| 111 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">HTTP</span> <span class="jser-tag">library</span> <span class="jser-tag">ReleaseNote</span></p> |
| 112 | + |
| 113 | +axios v1.9.0リリース。 |
| 114 | +`getSetCookie`のサポート |
| 115 | + |
| 116 | + |
| 117 | +---- |
| 118 | +<h1 class="site-genre">アーティクル</h1> |
| 119 | + |
| 120 | +---- |
| 121 | + |
| 122 | +## React Labs: View Transitions, Activity, and more – React |
| 123 | +[react.dev/blog/2025/04/23/react-labs-view-transitions-activity-and-more](https://react.dev/blog/2025/04/23/react-labs-view-transitions-activity-and-more "React Labs: View Transitions, Activity, and more – React") |
| 124 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">React</span> <span class="jser-tag">article</span></p> |
| 125 | + |
| 126 | +Reactの実験的な機能の紹介。 |
| 127 | +`<ViewTransition>`/`addTransitionType`/`<Activity>`。 |
| 128 | +DevToolsでReactのPerformance Profilerの可視化、依存のない`useEffect`、React Compilerなどについて |
| 129 | + |
| 130 | + |
| 131 | +---- |
| 132 | + |
| 133 | +## Tailwind vs Linaria: Performance Investigation |
| 134 | +[www.developerway.com/posts/tailwind-vs-linaria-performance](https://www.developerway.com/posts/tailwind-vs-linaria-performance "Tailwind vs Linaria: Performance Investigation") |
| 135 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">css</span> <span class="jser-tag">performance</span> <span class="jser-tag">article</span></p> |
| 136 | + |
| 137 | +TailwindとLinariaのパフォーマンスを比較調査した記事。 |
| 138 | +調査していくと、ベースとなるスタイルで`*`に対するスタイルが存在することで実行時のパフォーマンスに差異が発生していたという話 |
| 139 | + |
| 140 | + |
| 141 | +---- |
| 142 | + |
| 143 | +## Introducing Socket Fix for Safe, Automated Dependency Upgrad... |
| 144 | +[socket.dev/blog/introducing-socket-fix](https://socket.dev/blog/introducing-socket-fix "Introducing Socket Fix for Safe, Automated Dependency Upgrad...") |
| 145 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">npm</span> <span class="jser-tag">pnpm</span> <span class="jser-tag">article</span></p> |
| 146 | + |
| 147 | +パッケージのセキュリティアップデートの修正を行う`socket fix`コマンドについて。 |
| 148 | +npm/pnpmをサポートしている。 |
| 149 | + |
| 150 | + |
| 151 | +---- |
| 152 | + |
| 153 | +## Polishing your typography with line height units | WebKit |
| 154 | +[webkit.org/blog/16831/line-height-units/](https://webkit.org/blog/16831/line-height-units/ "Polishing your typography with line height units | WebKit") |
| 155 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">css</span> <span class="jser-tag">article</span></p> |
| 156 | + |
| 157 | +`1lh`は1 line heightで1行の高さを表す単位、`1rlh`はremと同じくRootの1行の高さを表す単位。 |
| 158 | +`1lh`を使ったタイポグラフィについて |
| 159 | + |
| 160 | + |
| 161 | +---- |
| 162 | + |
| 163 | +## Boost Node.js with V8 GC Optimization |
| 164 | +[blog.platformatic.dev/optimizing-nodejs-performance-v8-memory-management-and-gc-tuning](https://blog.platformatic.dev/optimizing-nodejs-performance-v8-memory-management-and-gc-tuning "Boost Node.js with V8 GC Optimization") |
| 165 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">nodejs</span> <span class="jser-tag">V8</span> <span class="jser-tag">article</span> <span class="jser-tag">performance</span></p> |
| 166 | + |
| 167 | +V8の世代別GCは、Scavengeという高速なGCをsemi-spaceのオブジェクトに行い、何回か生き残ったオブジェクトを昇格し、GCの頻度が少ないspaceに移動させる。 |
| 168 | +間違って昇格したオブジェクトが多いとなかなかメモリから解放されないため、このsemi-spaceのサイズを調整するオプションやメモリチューニングの方法についてなど |
| 169 | + |
| 170 | + |
| 171 | +---- |
| 172 | +<h1 class="site-genre">サイト、サービス、ドキュメント</h1> |
| 173 | + |
| 174 | +---- |
| 175 | + |
| 176 | +## unnoq/orpc: Typesafe APIs Made Simple 🪄 |
| 177 | +[github.com/unnoq/orpc?tab=readme-ov-file](https://github.com/unnoq/orpc?tab=readme-ov-file "unnoq/orpc: Typesafe APIs Made Simple 🪄") |
| 178 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">OpenAPI</span> <span class="jser-tag">nodejs</span> <span class="jser-tag">library</span></p> |
| 179 | + |
| 180 | +ルーティングの定義からOpen API Specを出力できるサーバ/クライアントのHTTPフレームワーク |
| 181 | + |
| 182 | + |
| 183 | +---- |
| 184 | +<h1 class="site-genre">ソフトウェア、ツール、ライブラリ関係</h1> |
| 185 | + |
| 186 | +---- |
| 187 | + |
| 188 | +## slevithan/oniguruma-to-es: Convert patterns from Oniguruma (the regex flavor used by Ruby, TextMate grammars, etc.) to native JavaScript RegExp |
| 189 | +[github.com/slevithan/oniguruma-to-es](https://github.com/slevithan/oniguruma-to-es "slevithan/oniguruma-to-es: Convert patterns from Oniguruma (the regex flavor used by Ruby, TextMate grammars, etc.) to native JavaScript RegExp") |
| 190 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">library</span> <span class="jser-tag">RegExp</span></p> |
| 191 | + |
| 192 | +Onigurumaの正規表現をJavaScriptの正規表現に変換するライブラリ |
| 193 | + |
| 194 | + |
| 195 | +---- |
| 196 | + |
| 197 | +## Nom-nom-hub/flash-install: A fast, drop-in replacement for npm install, focused on drastically speeding up Node.js dependency installation through deterministic caching, parallel operations, and .flashpack archive snapshotting. |
| 198 | +[github.com/Nom-nom-hub/flash-install](https://github.com/Nom-nom-hub/flash-install "Nom-nom-hub/flash-install: A fast, drop-in replacement for npm install, focused on drastically speeding up Node.js dependency installation through deterministic caching, parallel operations, and .flashpack archive snapshotting.") |
| 199 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">npm</span> <span class="jser-tag">console</span> <span class="jser-tag">Tools</span></p> |
| 200 | + |
| 201 | +キャッシュとスナップショットをサポートしたnpmパッケージのインストールを行うツール。 |
| 202 | +ハッシュベースのパスとhard linkを使ったキャッシュ、`.flashpack`というスナップショットファイルを扱うことができブランチ切り替え時の復元が高速に行える。 |
| 203 | + |
| 204 | + |
| 205 | +---- |
| 206 | + |
| 207 | +## andrewmd5/hako: An embeddable, lightweight, secure, high-performance JavaScript engine. |
| 208 | +[github.com/andrewmd5/hako](https://github.com/andrewmd5/hako "andrewmd5/hako: An embeddable, lightweight, secure, high-performance JavaScript engine.") |
| 209 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">WebAssembly</span> <span class="jser-tag">JavaScript</span> <span class="jser-tag">Tools</span> <span class="jser-tag">library</span></p> |
| 210 | + |
| 211 | +QuickJSベースのWebAssemblyにコンパイルして利用するJavaScriptエンジン。 |
| 212 | +Lynx/primjsをforkしたものをベースにしている。 |
| 213 | + |
| 214 | +- [lynx-family/primjs: JavaScript Engine Optimized for Lynx](https://github.com/lynx-family/primjs "lynx-family/primjs: JavaScript Engine Optimized for Lynx") |
| 215 | +- [Hako - by Andrew Sampson - ./make](https://andrews.substack.com/p/hako "Hako - by Andrew Sampson - ./make") |
| 216 | + |
| 217 | +---- |
0 commit comments